He siguiente código HTML:

<form action="view_rebate_master.php" method="post">
<div class="form-group">
<label for="company_name" class="col-lg-12">Manufacturer</label>
<div class="col-lg-12">
<select id="company_id" class="form-control" onchange="GetProductByManufacturerID(this.value)" name="company_id">
<option selected="selected" value="">All Manufacturers</option>
<option value="40">Test</option>
<option value="42">RK</option>
<option value="49">Blue Nun</option>
<option value="58">Unique Imports</option>
<option value="59">Pernod Ricard</option>
<option value="77">Smoking Loon</option>
<option value="78">Beringer</option>
</select>
</div>
</div>
<div class="col-xs-4">
<div class="form-group">
<label for="product_id" class="col-lg-12">Product Name</label>
<div class="col-lg-12">
<select id="product_id" class="form-control" name="product_id">
<option selected="selected" value="">All Products</option>
<option value="12">Riesling</option>
<option value="24">Superio Vodka</option>
<option value="32">Heineken</option>
<option value="33">Strong Bow</option>
<option value="34">Grocery</option>
<option value="35">Ruler</option>
<option value="36">Glass</option>
<option value="37">Brown Bread</option>
<option value="38">White Bread</option>
<option value="55">Cabernet Sauvignon</option>
</select>
</div>
</div>
</div>
<div class="col-lg-12">   
<div class="col-xs-5">
<div class="form-group">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type="submit" class="btn btn-primary" name="search" id="search">Search Rebates</button>
</div>
</div>
</div>

El AJAX de jQuery, el código es el siguiente:

function GetProductByManufacturerID(value) { 
$.ajax({
type: "POST",
url: "add_rebate_by_quat_volume.php",
data: { manufacturer_id: value, op:"" },
beforeSend: function() { 
$("#product_id").html('<option> Loading ...</option>');
},
success:function(data){ 
$("#product_id").html('');
$("#product_id").append(data);
}
});
}

Quiero hacer el botón de enviar desactivar cuando el AJAX llamada a la función se hace cambiando el valor del control select(seleccionar de control para la selección de fabricantes) y debería estar deshabilitado hasta que el AJAX éxito se recibe respuesta. Cuando AJAX éxito de la respuesta que recibirá el usuario debe ser capaz de hacer clic en el botón de enviar. Cómo lograr esto? Gracias de antemano.

OriginalEl autor PHPFan | 2014-07-28

3 Comentarios

  1. 18

    para deshabilitar

     $("#search").prop('disabled', true);

    para habilitar

     $("#search").prop('disabled', false);

    como el de abajo, en su función de

    function GetProductByManufacturerID(value) { 
    $.ajax({
    type: "POST",
    url: "add_rebate_by_quat_volume.php",
    data: { manufacturer_id: value, op:"" },
    beforeSend: function() { 
    $("#product_id").html('<option> Loading ...</option>');
    $("#search").prop('disabled', true); //disable button
    },
    success:function(data){ 
    $("#product_id").html('');
    $("#product_id").append(data);
    $("#search").prop('disabled', false); //enable button
    }
    });
    }

    OriginalEl autor Satish Sharma

  2. 6

    Algo como esto iba a hacer lo que quiera. Este es global, para el conjunto de la página, para cualquier petición ajax.

    $(document).ajaxStart(function() {
    $("#search").prop('disabled', true);
    }).ajaxStop(function() {
    $("#search").prop('disabled', false);
    });

    OriginalEl autor Rudy

  3. 0

    Me gustaría desactivar el botón antes de que la llamada ajax y habilitar de nuevo el éxito de devolución de llamada, ningún problema en hacer algo como la siguiente ?

     function GetProductByManufacturerID(value) { 
    $('#search').addAttr('disabled');
    $.ajax({
    type: "POST",
    url: "add_rebate_by_quat_volume.php",
    data: { manufacturer_id: value, op:"" },
    beforeSend: function() { 
    $("#product_id").html('<option> Loading ...      </option>');
    },
    success:function(data){ 
    $("#product_id").html('');
    $("#product_id").append(data);
    $('#search').removeAttr('disabled');
    }
    });
    }

    OriginalEl autor lame_coder

Dejar respuesta

Please enter your comment!
Please enter your name here