Onbox disabled and checkboxes enabled

I have a PHP function that disabled checkboxes when the table column is not empty. I am creating a script event for onchange. Here is what I have right now http://jsfiddle.net/Jr3L5/2/ . I need to do this if I choose editing, everything that is not an empty column will be included, while it will be, if I select add, all empty columns, not empty ones, should be disabled. Any help would be appreciated.

<script type="text/javascript" language="javascript">  
    function setCheckboxes3(act) {
        $('.checkbox').not(':disabled').prop('checked', act == 1 ? true : false);
    }
</script> 

while ($row = $result1->fetch_assoc()) {
    echo'<tr class="record"><td align="center">';
    if (empty($row['pr'])){
        echo '<a class="fancybox" href="addpr.php?counts=' . $row["id"] . '"></a></td>';
    } else {
        echo '<a href="javascript:void(0)"></a></td>';
    }
    echo"<td>" . $row["pr"] . "</td>';
    echo'<td><input name="checkbox[]" type="checkbox" id="checkbox[]" value="' . $row['id'] . '"'.($row['pr'] == ""?"disabled ":"").' style="cursor:pointer;" class="checkbox"></td></tr>';
}
+4
source share
1 answer

SOLVED - http://jsfiddle.net/dwebexperts/U4G8G/
Try this -

$("a.button").hide();
$(function() {
    $('#selectbox').change(function(){
        if ($('option:selected',$(this)).index() == '1') {
            $("a.button.edit").show();
            $("a.button.add").hide();
            $("a.button.chkmenu").show();
            //$(":input.pr([value==''])").prop("disabled", true);
            $('input.pr').each(function() {
                if($(this).val()==""){
                    $(this).prop("disabled", true);
                }
                if($(this).val()!=""){
                    $(this).prop("disabled", false);
                }
            });
        } else if ($('option:selected',$(this)).index() == '2') {
            $("a.button.edit").hide();
            $("a.button.add").show();
            $("a.button.chkmenu").show();
            $('input.pr').each(function() {
                if($(this).val()==""){
                    $(this).prop("disabled", false);
                }
                if($(this).val()!=""){
                    $(this).prop("disabled", true);
                }
             });
        } else {
            $("a.button.edit").hide();
            $("a.button.add").hide();
            $("a.button.chkmenu").hide();
            $('input.pr').each(function() {
               $(this).prop("disabled", false);
            });
        }
        });
    });

############################################ ###################



http://jsfiddle.net/dwebexperts/U4G8G/
HTML JQUERY: -

HTML-:

<table>
    <tr>
        <td><input class="pr" id="1" value="pr" type="text" /></td>
        <td><input name="checkbox[]" type="checkbox" id="checkbox[]" class="checkbox new1"/></td>
    </tr>
    <tr>
        <td><input class="pr" id="2"  type="text"/></td>
        <td><input name="checkbox[]" type="checkbox" id="checkbox[]" class="checkbox new2"/></td>
    </tr>
    <tr>
        <td><input class="pr"  id="3"  value="XYZ" type="text"/></td>
        <td><input name="checkbox[]" type="checkbox" id="checkbox[]" class="checkbox new3"/></td>
    </tr>
    <tr>
        <td><input class="pr"  id="4"  type="text"/></td>
        <td><input name="checkbox[]" type="checkbox" id="checkbox[]" class="checkbox new4"/></td>
    </tr>
    <tr>
        <td><input class="pr"  id="5"  type="text"/></td>
        <td><input name="checkbox[]" type="checkbox" id="checkbox[]" class="checkbox new5"/></td>
    </tr>

</table>
<select id="selectbox">
    <option></option>
    <option value="one">1</option> 
    <option value="two">2</option> 
</select>
  <a class="button add" style="cursor:pointer;"><span><b>Add Purchase Request</b></span></a>
  <a class="button edit" style="cursor:pointer;"><span><b>Edit Purchase Request</b></span></a>
  <a class="button remove" style="cursor:pointer;" name="remove"><span><b>Remove Purchase Request</b></span></a> 
  <a href="javascript:setCheckboxes3(true);" class="button chkmenu"><span><b>Check All</b></span></a>
  <a href="javascript:setCheckboxes3(false);" class="button chkmenu"><span><b>Uncheck All</b></span></a>

: -

$("a.button").hide();
$(function() {
    $('#selectbox').change(function(){
        if ($('option:selected',$(this)).index() == '1') {
            $("a.button.edit").show();
            $("a.button.add").hide();
            $("a.button.chkmenu").show();
            //$(":input.pr([value==''])").prop("disabled", true);
            $('input.pr').each(function() {
                if($(this).val()==""){
                    var inputid = $(this).attr("id");
                    $(".new"+inputid).prop("disabled", true);
                }
                if($(this).val()!=""){                    
                    var inputid = $(this).attr("id");
                    $(".new"+inputid).prop("disabled", false);
                }
            });
        } else if ($('option:selected',$(this)).index() == '2') {
            $("a.button.edit").hide();
            $("a.button.add").show();
            $("a.button.chkmenu").show();
            $('input.pr').each(function() {
                if($(this).val()==""){                    
                    var inputid = $(this).attr("id");
                    $(".new"+inputid).prop("disabled", false);
                }
                if($(this).val()!=""){                    
                    var inputid = $(this).attr("id");
                    $(".new"+inputid).prop("disabled", true);
                }
             });
        } else {
            $("a.button.edit").hide();
            $("a.button.add").hide();
            $("a.button.chkmenu").hide();
            $('input.pr').each(function() {
               $("input[type=checkbox]").prop("disabled", false);
            });
        }
        });
    });
+1

Source: https://habr.com/ru/post/1545616/


All Articles