如果选择下拉列表中的任何选项,则需要输入

时间:2017-11-18 03:26:08

标签: javascript php jquery

我有一张发票表单,其中包含一个由3列组成的表:kode_barang(ItemID),nama_barang(ItemName)和qty(数量)。再说它只有2行:

<form name="invoice" action="insert3.php" method="post">
<table id="theTable" border="1">
   <thead>
       <tr>
          <th> Kode Barang </th>
          <th> Nama Barang </th>
          <th> Qty </th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td><select name="kode_barang[]" id="kode_barang0" required /> </td>
         <td><input type="text" name="nama_barang[]" id="nama_barang0" required /></td>
         <td><input type="text" name='qty[]' required /></td>
      </tr>
      <tr>
         <td><select name="kode_barang[]" id="kode_barang1" /> </td>
         <td><input type="text" name="nama_barang[]" id="nama_barang1" /></td>
         <td><input type="text" name='qty[]' /></td>
      </tr>
   </tbody>
</table>

ItemID是一个下拉菜单,它的选项可以从另一个表动态填充。第一行中的所有字段都是必填字段,因为如果它是空的,它将不是新发票。

但是我遇到了第二排的问题。如果用户选择了某个项目,那么只有填写ItemNameQty时,他们才能提交表单。我四处搜索,发现了几个类似的问题,但没有一个答案对我有用,或者我可能只是听不懂。这是我的非工作尝试:

$( document ).ready(function() {

var $code = $('#kode_barang1'),
    $qty = $('#qty1'),
    $price = $('#harga_beli1');

var validator = $('#faktur').validate({
    debug: true,
    rules: {
        kode_barang[]: {
            required: function (element) {
                return $qty.val().length > 0 || $price.val().length > 0;
            }
        },
        qty[]: {
            required: function (element) {
                return $code.val().length > 0 || $price.val().length > 0;
            }
        },
        harga_beli[]: {
            required: function (element) {
                return $code.val().length > 0 || $qty.val().length > 0;
            },
            /* verify if confirmation is ok */
            equalTo: $np
        }
    },
    messages: {}
    });
});

有人可以帮帮我吗?谢谢。

1 个答案:

答案 0 :(得分:1)

这是你想要的,但有两个简单的领域。如果您需要帮助,请与我联系。

<script type="text/javascript">
    function isMandatory(){
        var dropDownElement = document.getElementById('dropdown');
        if(!dropDownElement){ // check if dropdown element exists
            return false;
        }
        if(dropDownElement.value == ""){ // check if value is selected in dropdown
            return false;
        }
        return true;
    }

    function submitForm(){
        var fieldElement = document.getElementById('someField');
        if(!fieldElement){ // check if textfield element exists
            return;
        }
        if(isMandatory() && fieldElement.value == ""){
            alert("Field is mandatory!"); // or show message in a div
        }
        else{
            // do something
        }
    }
</script>
<div>
    <select id="dropdown">
        <option value="">--select--</option>
        <option value="item-1">item-1</option>
        <option value="item-2">item-2</option>
    </select>
    <input id="someField" type="text" />
    <input type="button" value="submit" onclick="submitForm();" />
</div>