How to access hidden field's value?

Question

I'm using smarty template and my code is as follows:

    <div class="breadcrumb-wrap">

{include file='resources-sub-menu.tpl'}

  <ul class="page-flow">
    <li><a href="#">Home</a><span>></span></li>
    <li>Questions</li>
  </ul>
</div>
<h1 class="c-heading"> Match Questions </h1>
<div class="c-grad-box fnShowData">
  <div class="form-wrapper">
    <form id="view-questions-form" name="questions_filter" action="{$control_url}modules/questions/match_question.php" method="post">
            <input type="hidden" name="page" id="page" value="1" >
      <div class="w50">              
        <ul>
          <li>
            <label>Subjects</label>
            <div class="form-element">
              <select name="subject_id" id="subject_id" onchange="get_topics_by_subject(this.value, 'get_topics_by_subject_for_filter', '#topic_id'); return false;">
                <option value="">All</option> 
                {foreach from=$all_subjects item=subjects key=key} 
                <option value="{$subjects.subject_id}" {if $subject_id == $subjects.subject_id} selected="selected"{/if}>{$subjects.subject_name}</option>
                {/foreach}
              </select>
            </div>
          </li>
        </ul>
      </div>
      <div class="w50">              
        <ul>
          <li>
            <label>Topics</label>
            <div class="form-element">
              <select name="topic_id" id="topic_id">
                    <option value="">All</option> 
                    {foreach from=$all_topics item=topics key=key} 
                    <option value="{$topics.topic_id}" {if $topic_id==$topics.topic_id} selected="selected"{/if}>{$topics.topic_name}</option>
                    {/foreach}
                  </select>
            </div>
          </li>
          <li>
            <div class="find-que-ans">
              <p class="custom-form"><label></label></p>
              <input type="submit" class="c-btn submit_form" name="btn_submit" id="btn_submit" value="Match Questions" />
            </div>
          </li>                           
        </ul>
      </div>        
    </form>
  </div>
</div>
<br/><br/>
<table width="100%" class="base-table tbl-practice" cellspacing="0" cellpadding="0" border="0">
  <tr class="evenRow">
    <th width="33%" style="text-align:center;" class="question-id">Que ID</th>
    <th width="33%" style="text-align:center;" class="question-id">Matching Que IDs</th>
    <th width="33%" style="text-align:center;" class="question-id">Percentage(%)</th>
  </tr>
{if $all_match_questions}
  {foreach from=$all_match_questions item=qstn key=key}   
    {if $qstn.similar_questions_ids_and_percentage}
  <tr class="oddRow">
    <td class="question-id" align="center" valign="top">
      <a href="{$qstn.return_url}" title="View question" class="inline_view_question_detail">QUE{$qstn.question_id}</a>{if $qstn.question_appeared_count gt 1}-Appeared({$qstn.question_appeared_count}){/if}
    </td>
    <td class="question" align="center" valign="top">
      {foreach from=$qstn.similar_questions_ids_and_percentage item=question key=q_no}
        {if $question.question_id!=''}
      <a href="{$qstn.return_url}" title="View question" class="inline_view_question_detail">QUE{$question.question_id}</a>{if $question.question_appeared_count gt 1}-Appeared({$question.question_appeared_count}){/if}
      {if $question.question_appeared_count eq 0}
        <a href="{$control_url}modules/questions/match_question.php?op=delete&question_id={$question.question_id}&subject_id=&topic_id=" title="Delete question" class="inline_view_question_detail"> Delete</a>
      {/if}
        {/if}<br />
      {/foreach}
    </td>
    <td class="question" align="center" valign="top">
      {foreach from=$qstn.similar_questions_ids_and_percentage item=question key=q_no}
        {if $question.percentage!=''}{$question.percentage}{/if}<br />
      {/foreach}               
    </td>
  </tr>
    {/if}
  {/foreach}
{else}
  <tr>
    <td colspan="2" align="center"><b>No Questions Available</b></td>
  </tr>
{/if}
</table>

You can observe from the above code that there are two hidden fields named subject_id and topic_id respectively. Now On clicking a hyperlink I wan to send these hidden values in a query string. Following is the present code for hyperlink I want to append a subject_id and topic_id to the current query string. Can anyone guide me in this?

<a href="{$control_url}modules/questions/match_question.php?op=delete&question_id={$question.question_id}&subject_id=&topic_id=" title="Delete question" class="inline_view_question_detail"> Delete</a>

One more thing to note here is I don't want to submit the form. I just want to send the values through querystring only.

Answer 1

Hidden fields work just like any other input the value will come from the name of the input box.

<a href="{$control_url}modules/questions/match_question.php?op=delete&question_id={$question.question_id}&subject_id={$subjects.subject_id}&topic_id={$topics.topic_id}" title="Delete question" class="inline_view_question_detail"> Delete</a>

Answer 2

Looking at your codes, it seems to me that "subject_id" and "topic_id" are both string.

It's easy if they are string just basic append them. but if not, and it's a variable, just echo them like below

<select id= "<? subject_id ?>">

Answer 3

Why are u use hidden field not select value? In this Case,find select value as this is subject id

  on click for anchor tag  
   var id=$("#subject_id").val();//find select value 
   var subjectid=$("#"+id).val();
  //Append in anchor tag href and similarly for topic id

Answer 4

If you want to access the values of theese two fields when the page is loaded you can use this:

    $('#subject_id').val()
    $('#topic_id').val()

If you choose other values after the form is rendered you should use javascript and bind the click of the link to a javsacript function:

    $('.inline_view_question_detail').on('click', function() {
         var data = {}
         data['op'] = 'op';
         data[question_id'] = 'idofquestion';
         //and put your variables here
         $.ajax({
             url: 'theurltowhichyouwanttosendthedata',
             type: "POST",
             data: data,
             success: function() {
                  alert('success');  
             }
         });
    });