Javascript not reading value from hidden textBox - JQuery C# - Stack Overflow

admin管理员组

文章数量:1388844

I'm a non-specialist with JavaScript / JQuery and I'm having trouble figuring out why my script doesn't work. When my C# page loads, I have a hidden textBox txtHiddenKeywordArray which gets dynamically filled with ma separated values like... horse, buggy, track

I'm trying to use the highlight functionality in jquery.highlight-3.js where I have a label text field that will contain and highlight the words in the keywords list. I'm using the script

<script language="javascript" type="text/javascript">
    var myString = document.getElementById('<%=txtHiddenKeywordArray.ClientID%>').val()
    myArray = myString.split(" ");
    $(document).ready(function () {
        for (i = 0; i < myArray.length; i++)
            $("p").highlight(myArray[i])
    });
</script>

Here is the textBox declaration :

<asp:TextBox ID="txtHiddenKeywordArray" ClientIDMode="Static" runat="server" Visible="false"></asp:TextBox>

It worked great when I hard coded the values of var myString. I've tried researching it and keep seeing the same example of the way I have it done. The page does use a MasterPage. Could this affect it?

Any idea how I can get the script to see the values from the textbox? Do I need a RegisterStartUpScript or something? Thanks for any help you can provide.

I'm a non-specialist with JavaScript / JQuery and I'm having trouble figuring out why my script doesn't work. When my C# page loads, I have a hidden textBox txtHiddenKeywordArray which gets dynamically filled with ma separated values like... horse, buggy, track

I'm trying to use the highlight functionality in jquery.highlight-3.js where I have a label text field that will contain and highlight the words in the keywords list. I'm using the script

<script language="javascript" type="text/javascript">
    var myString = document.getElementById('<%=txtHiddenKeywordArray.ClientID%>').val()
    myArray = myString.split(" ");
    $(document).ready(function () {
        for (i = 0; i < myArray.length; i++)
            $("p").highlight(myArray[i])
    });
</script>

Here is the textBox declaration :

<asp:TextBox ID="txtHiddenKeywordArray" ClientIDMode="Static" runat="server" Visible="false"></asp:TextBox>

It worked great when I hard coded the values of var myString. I've tried researching it and keep seeing the same example of the way I have it done. The page does use a MasterPage. Could this affect it?

Any idea how I can get the script to see the values from the textbox? Do I need a RegisterStartUpScript or something? Thanks for any help you can provide.

• c#
• javascript
• jquery
• asp

Share Improve this question Follow asked Jun 3, 2012 at 4:12 Paul van ValkenburghPaul van Valkenburgh 7511 silver badge77 bronze badges 4

• Have you tried using display:none along with visibility:false? – coder Commented Jun 3, 2012 at 4:15
• have you checked txtHiddenKeywordArray is filled or not and also is javascript code is on same page or in external .js file – Amritpal Singh Commented Jun 3, 2012 at 4:15
• Hi, yes, the txtbox does get filled with the proper values. the textbox does not have a 'display property" Thanks – Paul van Valkenburgh Commented Jun 3, 2012 at 4:18
• Each of modern browsers have built in JavaScript debuggers.... consider stepping through JavaScript to see what is happening. – Alexei Levenkov Commented Jun 3, 2012 at 4:21

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 6

SET

style="display:none;"

INSTEAD of using

Visible="false" 

for your TextBox.

If you set TextBox to visible=false. Then, textbox will not be rendered in the html. So, will not be accessible.

Eg.:

<asp:TextBox ID="txtHiddenKeywordArray" ClientIDMode="Static" runat="server" style="display:none;"></asp:TextBox>

JS Code:

<script language="javascript" type="text/javascript">      
$(document).ready(function () {
 var myString = $('#<%=txtHiddenKeywordArray.ClientID%>').val();
    myArray = myString.split(" ");  
    for (i = 0; i < myArray.length; i++)
        $("p").highlight(myArray[i])
});

</script>

Try using

var myString = $('#<%=txtHiddenKeywordArray.ClientID%>').val();

var myString = document.getElementById('<%=txtHiddenKeywordArray.ClientID%>').val()

should be

var myString = $('#<%=txtHiddenKeywordArray.ClientID%>').val();

because .val() works on jQuery object.

You can also try

var myString = document.getElementById('<%=txtHiddenKeywordArray.ClientID%>').value;

The advice of @Kapil and @thecodeparadox is necessary. You also need to move the first two lines of javascript inside the $document.ready(...):

<script language="javascript" type="text/javascript">
$(document).ready(function () {
    var myString = $('#<%=txtHiddenKeywordArray.ClientID%>').val();
    myArray = myString.split(" ");
    for (i = 0; i < myArray.length; i++)
        $("p").highlight(myArray[i])
});

</script>

You don't need to pass the raw asp control tag to your selector. Just the name of the id should work. This should work.

Plain Old Javascript should be

var myString = document.getElementById('txtHiddenKeywordArray').value;

jQuery should be

var myString = $('#txtHiddenKeywordArray').val();

Have you tried changing you textbox to a hiddenfield (as that is what you are trying to do).

<asp:HiddenField runat="server" ID="txtHiddenKeywordArray" Value="horse, track" />

and js:

$(document).ready(function () {
    alert($("input[id$='txtHiddenKeywordArray']").val());
});

works just fine :)

本文标签： Javascript not reading value from hidden textBoxJQuery CStack Overflow