Pass html textbox value from a jquery modal to asp code behind

Question

This code displays a Jquery dialog with an html textbox that is shown after the user clicks on an asp:button btnNewGroup

<script type="text/javascript" language="javascript">
function pageLoad(sender, args) {
    var $dialog = $('<div><fieldset><label for="name">Name</label><input type="text" name="Name" id="name" class="text ui-widget-content ui-corner-all" /></div>')
        .dialog({
            modal: true,
            autoOpen: false,
            title: 'Enter New Group Name',
            buttons: {
                'New': function () {
                    $(this).dialog('close');
                },
                Cancel: function () {
                    $(this).dialog('close');
                }
            }
        });


        $("#<%=btnNewGroup.ClientID %>").click(function () {
            $dialog.dialog('open');
            return true;
        });
}
</script>

<asp:Button ID="btnNewGroup" runat="server" Height="26px" 
onclick="btnNewGroup_Click" Style="margin-bottom: 0px" Text="New Group" 
ClientIDMode="Static" />

protected void btnNewGroup_Click(object sender, EventArgs e)
    {
        String t = Request.Form["Name"];
    }

When the user clicks the new button in the dialogue I want to take the name from the textbox and use it in my code behinds asp new button click event.

Jive Boogie · Accepted Answer · 2012-01-14 00:46:24Z

I'm not really sure if this is what you are looking for but you coud pass the Name value to a Server side Web Method. by using Jquery's Ajax with in the function for the New button.

On the server side in your code behind page you create a Web Method by adding a

using System.Web.Services;

to the top of your page and then creating a web method in your code behind like this

[WebMethod]
public static void DoSomething(object name)
{
   //do something intersting
}

The Ajax call would replace the

 $(this).dialog('close');

That you currently have in your New Button click event with something like this.

var valFromNameBox = $("#name").val();
var jsonObj = '{name: "' + valFromNameBox + '"}';
var res;
$.ajax({
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    data: jsonObj,
    dataType: 'json',
    url: 'YourPage.aspx/DoSomething',
    success: function (result) {
    },
    error: function (err) {
        alert(err.toString());
    }
});

}

Aristos · Accepted Answer · 2012-01-14 00:05:07Z

0

Because is all ready an input control, and you make a post, normally you can get the value by using the Request.Form, in your case this parameter gets your value on code behind.

Request.Form["Name"]

One note, remove the <form></form> from your dialogue, because you break the asp.net form and probably not work.

var $dialog = $('<div><fieldset><label for="name">Name</label>
<input type="text" name="Name" id="name" 
   class="text ui-widget-content ui-corner-all" /></fieldset></div>')

answered Jan 14, 2012 at 0:05

Aristos

66.7k16 gold badges117 silver badges154 bronze badges

3 Comments

John Doe Over a year ago

Ok, removed the form, when i try to access Request.Form["Name"] the value is null.

Aristos Over a year ago

@JohnDoe then is not render inside the form of asp.net. Be sure that you render it there.

John Doe Over a year ago

Right now its a popup dialog how do i render it in asps form ?

Collectives™ on Stack Overflow

Pass html textbox value from a jquery modal to asp code behind

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related