Question

How to get the textbox value on code-behind after the textbox value assigned on a modal-box?

This is how the modal-box appear on the page:

<div id="dialog-form" title="Modal Box">
    <asp:TextBox ID="Textbox1" runat="server" ReadOnly="True">   
    <asp:Button ID="Save_Button" runat="server" Text="Save"></asp:Button>        
</div>

In order to assign the value on Textbox1, I attach a Javascript function to the LinkButton on a Gridview (the code not showed here) through code-behind based on the LinkButton clicked:

Dim myLinkButton As LinkButton    
For i As Integer = 0 To GV1.Rows.Count - 1
  myLinkButton = DirectCast(GV1.Rows(i).Cells(1).FindControl("LinkButton"), LinkButton)
  myLinkButton.Attributes.Add("onclick", "shopModalPopup('" + .Rows(i).Cells(0).Text & "'); return false;")
Next

Rows(i).Cells(0) is the first column on the Gridview, it is “ID“. This ID will be assigned to the Textbox1 while the Linkbutton clicked.

The Javascript code is on the same page as the Gridview code:

<script>
var grid_modal_options = {
                    height: 450,
                    width: 550,
                    modal: true
                };

function shopModalPopup(id) {
                    var DataField = id;
                    grid_modal_options.open = function () {
                        $('#dialog-form #Textbox1').val(DataField);
                    };

                    $("#dialog-form").dialog(grid_modal_options);
                    $("#dialog-form").parent().appendTo('form:first');
                }
</script>

When I clicked the Save Button on the modal-box, the value on the Textbox1 can’t catch on the code-behind. It always return null value. How to do that? Thank you very much.

Answer 1

please read this

http://www.codeproject.com/Articles/37090/JQuery-UI-Dialog-with-ASP-NET-empty-post-values

i think it might help you the problem might be that the div of dialog is moved outside the form you can solve it by using reference above or just defining another hidden input and update the hidden input with the same value

 $('#dialog-form #Textbox1').val(DataField);
 $('hiddenfield').val(DataField);

and then read the value from the hidden field

not sure if it the best answer but might work as a quick fix