多个文本框的jQuery对话框

时间:2016-06-09 20:36:27

标签: jquery dialog

我需要在点击多行的文本框时打开jQuery对话框

与按钮类似的东西: jsfiddle.net/UQFxP/47 /

image

HTML: 我有动态生成的MVC局部视图,下面的代码是对话框形式的片段:

<div id="dialog-form" style="width:250px">
            <form>
                <label for="name">Enter AD User/Group separated by ;</label>
                <input type="text" name="txtADUserGroup" id="txtADUserGroup" class="text ui-widget-content ui-corner-all" /><br />
                <input type="button" name="btnDialogOk" id="btnDialogOk" value="Ok" class="btn btn-primary btn-lg"/>    
            </form>
        </div>

JavaScript:
$(document).ready(function ()
          {
              //$("#dialog-form:ui-dialog").dialog("destroy");

              var adUserGroup = $("#txtADUserGroup"),
                  allFields=$([]).add(adUserGroup),
                  tips = $(".validateTips");

              function updateTips(t) {
                  tips
                  .text(t)
                  .addClass("ui-state-highlight");
                  setTimeout(function () {
                      tips.removeClass("ui-state-highlight", 1500);
                  }, 500);
              }


              function checkLength(o, n, min, max) {
                  if (o.val().length > max || o.val().length < min) {
                      o.addClass("ui-state-error");
                      updateTips("Length of " + n + " must be between " +
                          min + " and " + max + ".");
                      return false;
                  } else {
                      return true;
                  }
              }

              $("#dialog-form").dialog({
                  autoOpen: false,
                  height: 300,
                  width: 350,
                  modal: true,
                  buttons: {
                      "Ok": function () {

                          var bValid = true;
                          allFields.removeclass("ui-state-error");
                          bValid = bValid && checkLength(adUserGroup, "txtADUserGroup", 1, 500);

                          if (bValid) {
                              reason_name = $(".active_button").attr("id").replace("Add", "reason");
                              if (reason_name != "newReason") {
                                  obj = $('input[name^="' + reason_name + '"]');
                                  obj.val(obj.val() + ";" + adUserGroup.val());
                              }
                              $(this).dialog("close");
                          }
                      },
                      "Cancel": function () {
                          $(this).dialog("close");
                      }
                  },
                  close: function () {
                      $(".active_button").removeClass("active_button");
                      allFields.val("").removeClass("open");
                  }

              });

              function submit_form(ev)
              {
                  $("#dialog-form").attr("display","display");
                  $(this).addClass("active_button");
                  $("#dialog-open").dialog("open");
              }

              $("#txtADUserGroup").click(submit_form);
              $("input[type='text'][id$='AD']").click(submit_form); //all text boxes that ends with AD
              //$("input[type='text'][id^='AD']").click(submit_form); //all text boxes that begins with AD
          });

虽然点击事件已被触发,但我还不确定我错过了什么

0 个答案:

没有答案