CODEWITHSUNDEEP
asp.netasp.net-mvcasp.net-core
Ben
Ben

Reputation: 31

store id value into hidden field

I have 2 tabs here

<ul id="myTab" role="tablist">
      <li class="nav-item active">
          <a href="#doc" role="tab" aria-controls="queue" aria-selected="true" aria-expanded="true" >Documentation</a>
      </li>
      <li class="nav-item">
          <a href="#comment" role="tab" aria-controls="filePDFDoc" aria-selected="false" aria-expanded="false">Comments</a>
      </li>
</ul>

On click of any tab I want to save its id in hidden field.. Later I will be adding 'IF condition' on that Id.

Upvotes: 1

Views: 431

Answers (1)

Fei Han
Fei Han

Reputation: 27793

On click of any tab I want to save its id in hidden field.. Later I will be adding 'IF condition' on that Id.

You can refer to the following sample code to achieve the requirement.

<ul id="myTab" role="tablist">
    <li class="nav-item active">
        <a href="#doc" role="tab" aria-controls="queue" aria-selected="true" aria-expanded="true">Documentation</a>
    </li>
    <li class="nav-item">
        <a href="#comment" role="tab" aria-controls="filePDFDoc" aria-selected="false" aria-expanded="false">Comments</a>
    </li>
</ul>
<input id="hf_activetab" type="hidden" value="" />

JS code

<script>
    $(function () {
        $("a[role='tab']").click(function () {
            var txt = $(this).text();
            //make sure you set the id attr for tabs, and get the id attr of current clicked tab 
            //you can use following code snippet
            console.log($(this).attr("id"));

            if (txt == "Documentation") {
                //store the data in hidden field
                $("#hf_activetab").val("doc");
            } else {
                $("#hf_activetab").val("comment");
            }

            console.log($("#hf_activetab").val());
        })
    })
</script>

Upvotes: 1

Related Questions