CODEWITHSUNDEEP
javascriptjqueryasp.net
PeonProgrammer
PeonProgrammer

Reputation: 1535

on button click, loop through text boxes javascript

I am trying to make a function actuated by a button click. On click, a function loops through each input type=text element, assigns their value attribute to variable, if that variable = null or variable = "" call method confirm('are you sure you want to save a blank row'). Here's my code/pseudo code:

<script type="text/javascript">
    function isInputEmpty() {
        $("#btnSave").click(function(){
            $('input[type=text]').each(function(){
                var x = $(this).attr('value');
                var bool = false;
                if(x == null || x == "")
                {
                    bool = true;
                }
                else
                {
                    send the request
                }
                if(bool == true)
                {
                    if(confirm('Are you sure you want to save a blank URL?'))
                    {
                        send the request
                    }
                    else
                    {
                        do nothing or cancel the request
                    }
                }
                else
                {
                    send the request
                }
             }
        }
</script>

Here is my asp button code:

<asp:Button ID="btnSave" runat="server" Text="Save"/>

If you need more information, please let me know. Thanks in advance

Upvotes: 0

Views: 195

Answers (4)

Murali Murugesan
Murali Murugesan

Reputation: 22619

For ID issue, if you use ASP.Net 4.0 +, set ClientIDMode=Static

 <asp:Button ID="btnSave" runat="server" ClientIDMode="Static" Text="Save"/>

JS

<script type="text/javascript">
 function isInputEmpty() {
    $("#btnSave").click(function(){
        $('input[type=text]').each(function(){
            var x = this.value;

            var bool = false;
            if(x === null || x === "")
            {
                bool = true;
            }
            else
            {
                send the request
            }
            if(bool === true)
            {
                if(confirm('Are you sure you want to save a blank URL?'))
                {
                    LoadData();
                }
                else
                {
                    return;//do nothing
                }
            }
            else
            {
                send the request
            }
         }
    }


function LoadData()
{
$.ajax({
    type: "GET",
    url: 'page.aspx',       
    timeout: 1000,        
    success:function(data){    
     //do work
    },
    error:function(jqxhr, status){
     if(status==="error"){
     //handle error
     }    
 });
}
</script>

Upvotes: 1

ED-209
ED-209

Reputation: 4756

It's not entirely clear what your question is, but other answers here have rightfully focussed on the ID issue and .Net webforms changing the element's ID.

The other solutions suggested are fine, but there is also another way, and that is searching by partial ID. When clientIDmode isn't set to static (or if you're pre .Net 4.0) the .NET ID will always have the original id appended after an underscore, so you can find your element using jquery like this:

$("[id$='_btnSave']").click(function(){   ...

Upvotes: 0

Vishal Patel
Vishal Patel

Reputation: 973

You can also do like below....

<script type="text/javascript">
            function isInputEmpty() {
                var bool = false;
                $("#btnSave").click(function () {
                    $('input[type=text]').each(function () {
                        var x = $(this).attr('value');
                        if (x == null || x == "") {
                            bool = true;
                        }
                    });

                    if (bool == true) {
                        if (confirm('Are you sure you want to save a blank URL?')) {
                            //send the request
                        }
                        else {
                            //do nothing or cancel the request
                        }
                    }
                    else {
                        //send the request
                    }
                });
            }
        </script>

Upvotes: 0

tymeJV
tymeJV

Reputation: 104805

Since it's ASP.NET, that ID is going to be rendered different, try grabbing the Client ID (if the JS is in the same file, if it is not, use a unique class and assign the handler via that)

$("#<%=btnSave.ClientID%>").click(function() {
    $("input:text").each(function() {
        if (!this.value.length) {
            var confirm = confirm('are you sure you want to save a blank row')
            ..
        }
    });
});

Upvotes: 1

Related Questions