CODEWITHSUNDEEP
javascriptjquery
Pat
Pat

Reputation: 613

set select box value from a function

I have a data table, and each row has a set of columns having a date input boxes(Jquery datepicker) and one of the column in table has a dropdwon box values as Yes and No. when any of the date input box is selected with a value, then i should prepopulate the dropdown with Yes (by default it is No). using onselect event i pass the date box id, with that id i make out the dropdown id. The ID generated for date box is "tableId:row number in table:dateID", so in my case it is generated as "vendorTbl:0:rskDate".

$( ".rejct_input_date" ).datepicker({                                            
  changeMonth: true,
  changeYear: true,
  onSelect: function(selected,evnt) {
  updateRiskIdentified(evnt);
  }});

Now in updateRiskIdentifed function i use the date id and i frame the DDL id as like 

function updateRiskIdentified(value){                    
        var dateIdval = value.id;
            dateIdval = dateIdval.substring(0, dateIdval.lastIndexOf('_')) + "_rskIdntfd";
            var riskId = "#"+dateIdval+" ";
            alert(riskId);
            $($riskId + "option[value='1']").prop('selected', true);            
    }

Now i could generate the id i need, the last is giving unsupported psuedo ":0". Then i replaced dateIdval = dateIdval.replace(/:/g,"\\:"); to escape the ":". But the error message is "unsupported psuedo "\:0". Here is my options

 <f:selectItem itemLabel="Yes" itemValue="Y"></f:selectItem>
 <f:selectItem itemLabel="No" itemValue=""></f:selectItem>

and generated HTML:

<select name="vendorArtifacts:0:_rskIdntfd" class="af_selectOneChoice_content" id="vendorArtifacts:0:_rskIdntfd" style="width: 100%;"><option value="0">Yes</option><option value="1" selected="">No</option><option value="2">N/A</option></select>

Upvotes: 0

Views: 87

Answers (2)

Barmar
Barmar

Reputation: 781721

The .replace() call should work.

You also don't need to use the option[value="1"] selector. Just set the value of the <select> element.

$(".button").click(function() {
  updateRiskIdentified(this);
});

function updateRiskIdentified(value) {
  var dateIdval = value.id;
  dateIdval = dateIdval.substring(0, dateIdval.lastIndexOf('_')) + "_rskIdntfd";
  dateIdval = dateIdval.replace(/\:/g, "\\:");
  var riskId = "#" + dateIdval;
  console.log(riskId);
  $(riskId).val("1");
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="foo:bar:0_rskIdntfd">
  <option value="">Default</option>
  <option value="1">Choose 1</option>
  <option value="2">Choose 2</option>
</select>

<button class="button" id="foo:bar:0_button">Click</button>

Upvotes: 1

Farzin Kanzi
Farzin Kanzi

Reputation: 3435

We haven't this jquery selector: $($value "option[value='Y']").prop('selected', true); .

At least after the $value you need a + to be a jquery selector. Below is a sample:

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

<select id="gate">
        <option value="x">x</option>
        <option value="Y">y</option>
    </select>

<script>
  var $value = '#gate ';
        $($value + "option[value='Y']").prop('selected', true);
  </script>

Do not forget the space after the '#gate '.

Upvotes: 1

Related Questions