value is fetched using jquery for text box when i give static value but not when the user enters value

Question

i have a text box and i try to get value like this

$(function(){
    comment = $("#diaMissedPucomments").val();
});

this gets me value when i give some static value to the text box and does not get me the value when i allow the user to enter the value dynamically.

this the the html code i have :

<div style="display:none;" id="diaMissedPU" title="Missed P/U Comments" >
                       <table>
                            <tr>
                               <td>Enter Comments : </td>
                               <td><input type="text" id="diaMissedPucomments" name="diaMissedPucomments" />
                                <input type="text" id="textid" name="textid" value="antony" /></td>
                           </tr>
                       </table>
                    </div>

<input type="text" id="textid" name="textid" value="antony" /> i have used this line to check, i am able to get value for the textid but not for diaMissedPucomments

UPDATE :

 function openMissedPUComments(){
        var selectedValues = "",comment="";
        $('input:checked').each(function() {
              selectedValues =$(this).val()+","+selectedValues ;
            });
        if(selectedValues.length==0 && selectedValues==""){
            alert("To run this agent you must have at least one document selected");
            return false;
        }else{
          $("#diaMissedPU")
            .dialog(
                    {
                        modal: true,
                        draggable: false,
                        closeOnEscape: true,
                        title: "Missed P/U Comments ",
                        resizable: false,
                        width: 380,
                        // open: function() {
                        //            
                        // },
                        buttons: {
                            Ok: function () {
                                 comment = $("input#diaMissedPucomments").val();
                                 alert("comment : "+comment);
                                 viewname="CIMtrek_Compliance_Daily_Shipments_Case_Pack_Update_MissedPUs";
                                //callHome(viewname,comment);
                                global.getElementById("diaMissedPucomments").value="";
                                $(this).dialog('close');
                            }
                        }
                    });
        }
    }

the above function will be called to open the div as dialog.

How to get this done.

Please help me to get this.

Best Regards

Answer 1

I think you misunderstand the dialog usage.

Setting the dialog will automatically hide it with it option to not automatically open it.

Just set this attribute to not open automatically:

autoOpen: false

See these changes for example: comments in code

var comment = ""; //global to hold comment text
$(document).ready(function() {// put in a document ready handler
    $("#diaMissedPU").dialog({
        modal: true,
        autoOpen: false,
        draggable: false,
        closeOnEscape: true,
        title: "Missed P/U Comments ",
        resizable: false,
        width: 380,
        buttons: {
            Ok: function() {
                var mycomments = $("input#diaMissedPucomments");//save to reuse
                comment = mycomments.val();//get value
                alert("comment : " + comment);
                viewname = "CIMtrek_Compliance_Daily_Shipments_Case_Pack_Update_MissedPUs";
                //callHome(viewname,comment);
                mycomments.val("");// clear value
                $(this).dialog('close');
            }
        },
        close: function(event, ui) {// use this or not, just to illustrate
            alert(comment);
        }
    });
    $("#wackme").click(function() {// button to activate your function
        openMissedPUComments();
        alert("commentbefore : " + comment); //NOTE: runs before dialog closes
    });
});

function openMissedPUComments() {
    var selectedValues = "";
    comment = "";//clear value in variable
    $('input:checked').each(function() {
        selectedValues = $(this).val() + "," + selectedValues;
    });
    if (selectedValues.length == 0 && selectedValues == "") {
        alert("To run this agent you must have at least one document selected");
        return false;
    } else {
        $("#diaMissedPU").dialog("open");
    }
}

sample working :http://jsfiddle.net/Hw6ZA/

Answer 2

It is coming. Just check this..

$("#diaMissedPucomments").blur(function() {
    comment = $("#diaMissedPucomments").val();
    alert(comment);
});

I dont know why u have given style="display:none;"