web-dev-qa-db-fra.com

Obtenir la valeur de la zone de texte en Javascript

J'essaie d'obtenir la valeur de la zone de texte en javascript, mais cela ne fonctionne pas. Ci-dessous le code de ma page de test

<%@ Page Title="" Language="VB" MasterPageFile="~/Site.Master" AutoEventWireup="false"
CodeFile="test3.aspx.vb" Inherits="test3" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="Server">
<script language="javascript">

    function GetAlert() {

        var TestVar = document.getElementById('txt_model_code').value;
        alert(TestVar);

    }

</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
<asp:TextBox ID="txt_model_code" runat="server" ></asp:TextBox><br /><br />

<input type="button" value="db Function" onclick="GetAlert()" /><br />
</asp:Content>

Alors, où est-ce que je vais mal ?? Comment obtenir le texte saisi dans la zone de texte dans le javascript ???

6
Shijilal

Utilisation 

document.getElementById('<%= txt_model_code.ClientID %>')

au lieu de 

document.getElementById('txt_model_code')`

Vous pouvez également utiliser onClientClick au lieu de onClick.

15
Nirmal

En effet, ASP.NET change l'id de votre zone de texte, si vous exécutez votre page et faites une source d'affichage, vous verrez que l'id de la zone de texte ressemble à quelque chose comme: 

ctl00_ContentColumn_txt_model_code

Il y a plusieurs façons de contourner cela:

Utilisez le nom du contrôle réel: 

var TestVar = document.getElementById('ctl00_ContentColumn_txt_model_code').value;

utiliser la propriété ClientID dans les balises de script ASP

document.getElementById('<%= txt_model_code.ClientID %>').value;

Ou, si vous exécutez .NET 4, vous pouvez utiliser la nouvelle propriété ClientIdMode, voir ce lien pour plus de détails.

http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and- net-4-0-series.aspx1

6
Sean Taylor

Puisque vous avez la page maître et que votre contrôle est dans l'espace réservé au contenu, votre ID de contrôle sera généré différemment du côté client. tu dois faire comme ...

var TestVar = document.getElementById('<%= txt_model_code.ClientID %>').value;

Javascript fonctionne côté client et pour obtenir de la valeur, vous devez fournir l'identifiant client de votre contrôle

2
Muhammad Akhtar

L'identifiant que vous essayez est un serveur.

Cela va rendre dans le navigateur différemment.

essayez d’obtenir l’ID en regardant le code HTML dans le navigateur.

var TestVar = document.getElementById ('ctl00_ContentColumn_txt_model_code'). value;

cela peut fonctionner.

Ou faites cette méthode ClientID. Cela fonctionne aussi, mais au final, le navigateur obtiendra la même chose que ce que j'avais écrit.

1
Bindas
<script type="text/javascript" runat="server">
 public void Page_Load(object Sender, System.EventArgs e)
    {
        double rad=0.0;
        TextBox1.Attributes.Add("Visible", "False");
        if (TextBox1.Text != "") 
        rad = Convert.ToDouble(TextBox1.Text);    
        Button1.Attributes.Add("OnClick","alert("+ rad +")");
    }
</script>

<asp:Button ID="Button1" runat="server" Text="Diameter" 
            style="z-index: 1; left: 133px; top: 181px; position: absolute" />
<asp:TextBox ID="TextBox1" Visible="True" Text="" runat="server" 
            AutoPostBack="true" 
            style="z-index: 1; left: 134px; top: 133px; position: absolute" ></asp:TextBox>

utiliser l'aide de cela, espérons qu'il sera utile

 

        <script type="text/javascript">
            function MyFunction() {
                var FNumber = Number(document.getElementById('txtFirstNumber').value);
                var SNumber = Number(document.getElementById("txtSecondNumber").value);
                var Sum = FNumber + SNumber;
                alert(Sum);
            }

        </script>

        <table class="auto-style1">
            <tr>
                <td>FirstNaumber</td>
                <td>
                    <asp:TextBox ID="txtFirstNumber" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>SecondNumber</td>
                <td>
                    <asp:TextBox ID="txtSecondNumber" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td>
                    <asp:TextBox ID="txtSum" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td>
                    <asp:Button ID="BtnSubmit" runat="server" Text="Submit" OnClientClick="MyFunction()" />
                </td>
            </tr>
        </table>
    </div>
</form>
0
Sagar R