ASP.Net Javascript integration

Question

I am trying to use the following script in asp.net:

<script language="javascript" type="text/javascript">
    function checktext() {
        var txt = document.getElementById('tbComments');

        if (txt.Text.Length > 0) {
            alert('Thank you for submitting feedback.');

            return true;
        }
        else {
            alert('Sorry, you must enter text before submitting.')

            return false;
        }
    }
</script>


    <asp:Button ID="btnSave" runat="server" Text="Submit" onclick="btnSave_Click" OnClientClick="checktext();" />

I have tried using it on the onclick event.. the script will just not work at all.

Any Ideas?

Answer 1

Try calling it like this:

<asp:Button 
    ID="btnSave" 
    runat="server" 
    Text="Submit" 
    onclick="btnSave_Click" 
    OnClientClick="return checktext();" />

Also this line looks suspicious in a web forms application:

document.getElementById('tbComments');

Make sure that the generated id of your control is not prefixed with something else.

Answer 2

Replace:

<asp:Button ID="btnSave" runat="server" Text="Submit" onclick="btnSave_Click" OnClientClick="checktext();" />

with:

<asp:Button ID="btnSave" runat="server" Text="Submit" onclick="btnSave_Click" OnClientClick="return checktext();" />

Replace:

var txt = document.getElementById('tbComments');

With:

var txt = document.getElementById('<%= tbComments.ClientId %>');

HTH.

Answer 3

you can use the ClientID property for getting the name of a Control on the client side. I suggest you to try jQuery for all these though

var txt = document.getElementById('<%=tbComments.ClientID%>');

besides, the OnClientClick has to receive a true or false value, in order to "know" whether to send the request to the server; so you have to change it with something like OnClientClick="return checktext();"

Answer 4

everone else mentioned OnClientClick so I won't address that.

assuming tbComments is a textbox of some kind, this line

if (txt.Text.Length > 0) {

is going to fail because Text is not a property of html inputs or textareas, which is how asp.net textboxes are rendered. what you want is

if (txt.value.length > 0) {

also, is there some reason you're not using a regular asp.net RequiredFieldValidator control? you're doing more work than you need to. If you absolutely have to have alert boxes, you can use a CustomValidator control to call your function (you'll have to tweak it to fit the model).