Bootbox jquery中的Javascript函数

Javascript function inside Bootbox jquery

本文关键字：函数 Javascript 中的 jquery Bootbox      更新时间：2023-09-26

嗨，我如何在bootbox jquery中调用函数？

这是一个示例，位于select name="Status"如果可能的话，我会调用一个函数来显示和隐藏在html_form变量中调用的table的tr。我该怎么做？

function ChangeStatusDossier(UtenteCreatore) {
    var html_form = '<form name="ChangeStatusDossier" id="ChangeStatusDossier" class="ChangeStatusDossier"><table><tr><th colspan="2"><h2 class="blue">Change Dossier Status</h2></th></tr><tr><td><strong>Choose status   </strong>&nbsp;&nbsp;</td><td><select name="Status" onchange="Show(this.value);"><option value="0">Under process</option><option value="1">Under collection</option><option value="2">Cargo collected</option><option value="159">In Warehouse</option><option value="1485">To Destination</option></select></td></tr><tr id ="HubChoose" style="display:none;"><td>Choose hub</td><td><select name="Hub"><option>HUB MILANO</option></select></td></tr><input type="hidden" name="UtenteCreatore" value="' + UtenteCreatore + '"></table><form>';
    bootbox.confirm(html_form, function (result) {
        if (result) {
            $('#ChangeStatusDossier').submit();
        }
    });
    function Show(value) {
        if (value == "159") {
            $("#HubChoose").show();
        }
    }
}

在您的情况下，最好使用dialog方法而不是confirm。

以下是如何做到这一点：

function ShowHub(value) {
  if (value == "159") {
    $("#HubChoose").show();
  }
  else {
    $("#HubChoose").hide();
  }
}
jQuery("#default").on("click", function() {
  bootbox.dialog({
    title: "This is a form in a modal.",
    message:
'<form class="ChangeStatusDossier" id="ChangeStatusDossier" name="ChangeStatusDossier">' +
    '<input name="UtenteCreatore" type="hidden" value="' + UtenteCreatore + '">' +
    '<table>' +
        '<tr>' +
            '<th colspan="2">' +
                '<h2 class="blue">Change Dossier Status</h2>' +
            '</th>' +
        '</tr>' +
        '<tr>' +
            '<td><strong>Choose status</strong> &nbsp;&nbsp;</td>' +
            '<td><select name="Status" onchange="ShowHub(this.value);">' +
                '<option value="0">' +
                    'Under process' +
                '</option>' +
                '<option value="1">' +
                    'Under collection' +
                '</option>' +
                '<option value="2">' +
                    'Cargo collected' +
                '</option>' +
                '<option value="159">' +
                    'In Warehouse' +
                '</option>' +
                '<option value="1485">' +
                    'To Destination' +
                '</option>' +
            '</select></td>' +
        '</tr>' +
        '<tr id="HubChoose" style="display:none;">' +
            '<td>Choose hub</td>' +
            '<td><select name="Hub">' +
                '<option>' +
                    'HUB MILANO' +
                '</option>' +
            '</select></td>' +
        '</tr>' +
    '</table>' +
'</form>',
    buttons: {
      success: {
        label: "Submit",
        className: "btn-success",
        callback: function () {
            $('#ChangeStatusDossier').submit();
          showResult("Form submitted!");
        }
      },
    cancel: {
      label: "Cancel",
      className: "btn-danger",
      callback: function() {
        showResult("Canceled!");
      }
    }
   } // buttons
  }); // dialog
});

function showResult(result) {
  if (typeof result !== "undefined" && result !== null) {
    console.log(result);
  }
}

这是一个正在工作的DEMO

相关文章：