0

ユーザーが別の選択ボックスに入力した内容に基づいて動的に無効化および有効化する html 選択ボックスを作成しようとしています...これは、html だけを使用したときに正常に機能していましたが、このために選択された jQuery プラグインを使用したいと思います、そしてそれは機能していません...私がする必要がある主なことonchangeは、他の選択ボックスに基づいて無効または有効に選択された更新です。これは選択されたもので可能ですか？そしてどうやって？本当にありがとう。

以下は私のjavascriptです：

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>PROCapture Marketing | My Dashboard</title>
<link rel="stylesheet" type="text/css" href="../Style Sheets/PCMBackOffice-Styles.css">
<link href="../Style Sheets/headermenuhome.css" rel="stylesheet"><script type="text/javascript" src="../Scripts/jQuery1.7.1.js"></script>
<script src="../Scripts/instantiatemenu.js"></script>
<script>
function displayleads(str)
{
var xmlhttp;
if (str=="")
  {
  document.getElementById("fromleadstransfer").innerHTML="<option value=''>Select Leads To Transfer...</option>";
  document.getElementById("fromleadstransfer").disabled=true;
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("fromleadstransfer").innerHTML=xmlhttp.responseText;
    if (document.getElementById("fromleadstransfer").value != "noleads") {
    document.getElementById("fromleadstransfer").disabled=false;
    } else {
    document.getElementById("fromleadstransfer").disabled=true;
    }
    }
  }
xmlhttp.open("GET","../Scripts/transferfromselect.php?system="+str,true);
xmlhttp.send();
}
</script>
<script>
function displayfolders(str2)
{
var xmlhttp;
if (str2=="")
  {
  document.getElementById("tofoldertransfer").innerHTML="<option value=''>Select Folder To Send Leads...</option>";
  document.getElementById("tofoldertransfer").disabled=true;
  return;
  } 
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("tofoldertransfer").innerHTML=xmlhttp.responseText;
    document.getElementById("tofoldertransfer").disabled=false;
    }
  }
xmlhttp.open("GET","../Scripts/transfertoselect.php?system="+str2,true);
xmlhttp.send();
}
</script>
<link rel="stylesheet" type="text/css" href="../chosen/chosen2.css">
<script src="../chosen/jquery.js"></script>
<script src="../chosen/chosen.jquery.js"></script>
<script>
jQuery(document).ready(function(){
  jQuery(".fromleadstransfer").chosen();
  jQuery(".fromsystemtransfer").chosen();
  jQuery(".tofoldertransfer").chosen();
  jQuery(".tosystemtransfer").chosen();
  jQuery(".operationselect").chosen({disable_search_threshold: 3});
});

そして、ここにフォームがあります：

<form method="post" name="transferleadsform">
    <div class="transferleftside">
    <div class="primarytransfercontainer">
    <span class="primarytransferspan">From:</span>
    <br>
    <div class="transferinnercontainer1"><label>Operation: </label>
    <select id="operationselect" name="operationselect" class="operationselect">
    <option value="Copy" selected="selected">Copy</option>
    <option value="Move">Move</option>
    </select></div>
    <br>
    <div class="transferinnercontainer2"><label>System: </label>
    <select name="fromsystemtransfer" class="fromsystemtransfer" id="fromsystemtransfer" onChange="displayleads(this.value)">
    <option value="">Select A System...</option>
    <?php
        foreach($systems as $systemid) {  
        ?>
        <option value="<?php echo $systemid?>"><?php echo $systemid?></option>
        <?php
        }
        ?>
    </select></div>
    <br>
    <div class="transferinnercontainer2"><label>Leads: </label>
    <select name="fromleadstransfer" multiple disabled="disabled" class="fromleadstransfer" id="fromleadstransfer">
    <option value="">Select Leads To Transfer...</option>
    </select></div>
    </div>
    </div>
    <div class="transferrightside">
    <div class="primarytransfercontainer">
    <span class="primarytransferspan">To:</span>
    <br>
    <div class="transferinnercontainer1"><label>System: </label>
    <select id="tosystemtransfer" name="tosystemtransfer" class="tosystemtransfer" onChange="displayfolders(this.value)">
    <option value="">Select A System To Send Leads...</option>
    <?php
        foreach($systems as $systemid) {
        ?>
        <option value="<?php echo $systemid?>"><?php echo $systemid?></option>
        <?php
        }
        ?>
    </select></div>
    <br>
    <div class="transferinnercontainer3"><label>Folder: </label>
    <select id="tofoldertransfer" name="tofoldertransfer" disabled="disabled" class="tofoldertransfer">
    <option value="">Select Folder To Send Leads...</option>
    </select></div>
    <br>
    <input type="submit" class="transferbutton TransferSprites" value="<< Transfer Leads >>">
    </div>
    </div>
    <div class="longdivider TransferSprites">
    </div>
    </form>
4

1 に答える 1

0

要素を無効にした後、更新機能をトリガーする必要があります

$(element).prop('disabled', true).trigger("liszt:updated");

Chosen を動的に更新する 選択フィールドのオプションを更新する必要があり、Chosen に変更を反映させたい場合は、フィールドで "listzt:updated" イベントをトリガーする必要があります。選択されたものは、更新されたコンテンツに基づいて再構築されます。

jQuery Version: $("#form_field").trigger("liszt:updated");
Prototype Version: Event.fire($("form_field"), "liszt:updated");
于 2012-12-04T21:07:17.173 に答える