CODEWITHSUNDEEP
javascript
RunDontStop
RunDontStop

Reputation: 3

Checking a particular check box

Very new to javascript my apologies. Here is sample html:

    <!DOCTYPE html>
    <html>
    <td class="griditemcell" align="center" valign="top">
    <input id="JobGrid_cb_11135_150_100_0" type="checkbox" name="JobGrid$ctl02$cb_11135_150_100" JobID="11135" JobType="100" onclick="CheckBoxClicked(&#39;JobGrid_cb_11135_150_100_0&#39;,11135,150,100);" />
    </td>
    <td class="griditemcell" align="center" valign="top">
    <input id="JobGrid_cb_43487_150_401_0" type="checkbox" name="JobGrid$ctl02$cb_43487_150_401" JobID="43487" JobType="401" onclick="CheckBoxClicked(&#39;JobGrid_cb_43487_150_401_0&#39;,43487,150,401);" />
    </td>
    <td class="griditemcell" align="center" valign="top">
    <input id="JobGrid_cb_43502_150_700_0" type="checkbox" name="JobGrid$ctl02$cb_43502_150_700" JobID="43502" JobType="700" onclick="CheckBoxClicked(&#39;JobGrid_cb_43502_150_700_0&#39;,43502,150,700);" />
    </td>
    </html>

All this displays is 3 checkboxes, nothing else.

In browser console I can check any one of three boxes using getElementbyId,here is script to check first box:

javascript: document.getElementById("JobGrid_cb_11135_150_100_0").checked=true;

My problem is I want to use the "JobType" value because I need to run the script on many webpages similar to this one. From one webpage to the next, the id always changes but "JobType" is the constant value. Each box is always JobType"100" or "401" or "700"

I would like to check any of the three boxes by referencing that value, instead of the id.

Thank you.

Upvotes: 0

Views: 68

Answers (1)

IT goldman
IT goldman

Reputation: 19493

use querySelector("selector") to select an element. In this case, selector using the attribute JobType.

document.querySelector("[JobType='401']").checked = true;
<!DOCTYPE html>
<html>
<td class="griditemcell" align="center" valign="top">
  <input id="JobGrid_cb_11135_150_100_0" type="checkbox" name="JobGrid$ctl02$cb_11135_150_100" JobID="11135" JobType="100" data-onclick="CheckBoxClicked(&#39;JobGrid_cb_11135_150_100_0&#39;,11135,150,100);" />
</td>
<td class="griditemcell" align="center" valign="top">
  <input id="JobGrid_cb_43487_150_401_0" type="checkbox" name="JobGrid$ctl02$cb_43487_150_401" JobID="43487" JobType="401" data-onclick="CheckBoxClicked(&#39;JobGrid_cb_43487_150_401_0&#39;,43487,150,401);" />
</td>
<td class="griditemcell" align="center" valign="top">
  <input id="JobGrid_cb_43502_150_700_0" type="checkbox" name="JobGrid$ctl02$cb_43502_150_700" JobID="43502" JobType="700" data-onclick="CheckBoxClicked(&#39;JobGrid_cb_43502_150_700_0&#39;,43502,150,700);" />
</td>

</html>

Upvotes: 2

Related Questions