从Javascript触发Jquery模式

时间:2014-01-23 11:14:03

标签: javascript jquery forms

我正在尝试从javascript触发jquery模式框但我不知道如何。我正在进行表单验证以检查项目是否已填满,这会在屏幕上显示一条消息,说明需要填写。这部分工作正常,但我也想使用我在网站上使用的jqueryui来触发一个类似的模态框。

任何人都有指点如何将两者结合起来?我知道JQuery是一个javascript库所以我希望我不是自己制作一个完全扳手而且它非常简单....

全部谢谢!

JavaScript表单验证

<script>
function validateForm()
{
var e = document.getElementById("Consultant");
var x = e.options[e.selectedIndex].value;
if (x==null || x=="")
  {
  document.getElementById("EC1").style.display = "block";
 <-- code to fire off a modal box here -->
  return false;
  }
}
</script>

JQuery Modal

 <script type="text/javascript">
    $(function() {
        $("#dialog").dialog({
            bgiframe: true,
            modal: true,
            buttons: {
                Ok: function() {
                    $(this).dialog('close');
                }
            }
        });
    });
    </script>

<div id="dialog" title="Form Error!">
    <p>
        Please fill out all items and try again
    </p>
</div>

1 个答案:

答案 0 :(得分:0)

试试这个:$('#dialog').dialog('open');

jQuery API Documentation

更好的是,为什么不使用jQuery来验证表单?

您的代码:

function validateForm() {
   var e = document.getElementById("Consultant");
   var x = e.options[e.selectedIndex].value;
   if (x==null || x=="") {
      document.getElementById("EC1").style.display = "block";
      <-- code to fire off a modal box here -->
      return false;
   }
}

成为:

function validateForm() {
   var e = $('#Consultant');
   var x = e.val();

   if (x == null || x == "") {
      $('#EC1').hide();
      $('#dialog').dialog('open');
      return false;
   }
}