Disable input based on result from php

Question

I am using the chosen plugin to create dynamic selects and inputs. What I am trying to do is, based on the result from php, instead of the default placeholder, append text to the placeholder and disable the input.

At the moment, the echo is displaying in the select and I can change that to reflect any code changes. I thought perhaps an if statement to check the val of 'data' and if it == 'No files in that box', but I am still learning so need some help. The input I need to disable is: #file_dstr.

I have looked at various ways of possibly achieving this, but my jQuery skills are sadly lacking. I would appreciate it if someone could help me to achieve this. many thanks.

Plugin: http://harvesthq.github.io/chosen/options.html

html

<div class="fieldset">
   <h1><span>Select Your File(s)</span></h1>
     <p>
      <select data-placeholder="Choose your file(s)..." class="chosen-select" name="file_dstr[]" id="file_dstr" multiple required="required">
        <option value=""></option>

       </select><span></span>
      </p>
 </div>

jquery

submitHandler: function ()
{
  if ($("#USRfiledstr").valid() === true)
  {
    var data = $("#USRfiledstr").serialize();

    $.ajax(
    {
      type: "POST",
      url: "fdstr.php",
      data: data,
      dataType: "json",

      success: function (data)
      {
        if (data.opp == 'error')
        {
          var messageOutput = '';
          for (var i = 0; i < data.length; i++)
          {

            messageOutput += data[i].file + '  ';

          }

          notif({
            msg: "There was an error destroying the following file: "  + '<br /><br />' + '<b><font color=\"black\">' + data.file + '</font></b><br /><br />' + ' Please correct this error and try again.<br />If this error persists, please contact us quoting ref: ' + '<b><font color=\"#fbf66a\">' + '#FDSTR0001.<br />' + '</font>' + '<br />' + 'Thank you.',
            type: "frtvError",
            position: "center",
            width: 490,
            height: 75,
            multiline: true,
            timeout: 6000,
            opacity: 0.8,
            fade: 10,
        });
        }
        else
        {
          var messageOutputs = '';
          for (var i = 0; i < data.length; i++)
          {

            messageOutputs += data[i].file + '  ';

          }

          $("#USRfiledstr").get(0).reset();
          $("#file_dstr").load("refreshFdstr.php");
          //$(".chosen-select").val('').trigger("chosen:updated");
          $("#fdstr_dept").trigger("chosen:updated");
          $("#fdstr_address").trigger("chosen:updated");

          notif({
            msg: "You have successfully destroyed the following file(s)."  + '<br /><br />' + '<b><font color=\"black\">' + data.file + '</font></b><br /><br />' + ' This transaction was successfully entered into the database.<br />Thank you.',
            type: "FileRtvSuccess",
            position: "center",
            width: 490,
            height: 75,
            multiline: true,
            timeout: 6000,
            opacity: 0.9,
            fade: 10,
        });
        $("#fdstrbox_add_chosen").find('option:selected').remove();
        $("#fdstrbox_add").html('');
        $("#fdstrbox_add").trigger("chosen:updated");
        $("#file_dstr_chosen").find('option:selected').remove();
        $("#file_dstr").html('');
        $("#file_dstr").trigger("chosen:updated");
        }

      }
    });
  }
}

php

echo "<option value='No files in that box'>No files in that box</option>";

Answer 1

If you have a variable $noFiles that would be true if there are no files and false otherwise you could do:

<select data-placeholder="Choose your file(s)...<?= $noFiles?' some extra text':''; ?>" class="chosen-select" name="file_dstr[]" id="file_dstr" multiple required="required"<?= $noFiles?' disabled':''; ?>>