Home/ Questions/Q 3323134
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-17T23:15:57+00:00

I am very new to Javascript and jQuery. I managed to make a dialog

  • 0

I am very new to Javascript and jQuery. I managed to make a dialog box with jQuery, it is giving a warning before submitting.

The problem is I don’t want to show the label and field on the warning page if it is empty. I can’t do this with PHP because form is not submitted. I need to do with jQuery or Javascript.

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.2.custom.min.js"></script>
<script type="text/javascript" src="js/thickbox-compressed.js"></script>

<script type="text/javascript">
            $(function(){
                // jQuery UI Dialog    
                 $('#dialog').dialog({
                    autoOpen: false,
                    width: 400,
                    modal: true,
                    resizable: false,
                    buttons: {
                        "Submit Form": function() {
                            document.testconfirmJQ.submit();
                        },
                        "Cancel": function() {
                            $(this).dialog("close");
                        }
                    }
                });

                $('form#testconfirmJQ').submit(function(){
                    $("p#dialog-email").html($("input#emailJQ").val());
                    $('#dialog').dialog('open');
                    return false;
                });

</script>

</head>

<body>
<form id="testconfirmJQ" name="testconfirmJQ" method="post">
<fieldset>
<label for="email">E-mail:</label>
<input id="emailJQ" type="text" name="emailJQ" value="" />
<input id="submitJQ" name="submitJQ" type="submit" value="Submit" />
</fieldset>
</form>

<div id="dialog">
<p>E-mail</p>
<p id="dialog-email"></p>
</div>


</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    What you really need is Validation.

    To not reinvent the wheel, have a look jQuery Validation

    Edit

    var email = $("input#emailJQ").val();
if (email === "") {
    $('#dialog-email').addClass('hidden');
}

    and then you can define a hidden class in your stylesheet

    .hidden {
    display:none;
}

    To hide even the “E-mail” paragraph label then you need to assign an id to the <p> tag or better wrap the two in a block element with an ID and assign the class to that element

    • 0