Search code examples
phpzend-frameworkhtml-selectselectionchanged

Onchange event after selecting in select dropdown list in ZEND


I have a view with a dropdown list using select tag and I want to how can i have an event or an onchange event after selecting a value in my dropdown.

here is my code in index.phtml

    <?php if (count($users)): ?>
    <table class="table table-hover">
    <thead>
    <tr>
        <th>Name</th>
        <th>E-mail</th>
        <th>Level</th>
        <th></th>
      </tr>
    </thead>
    <?php foreach ($users as $user): ?>
   <tr>
        <td><a href="<?php echo $this->url('user/edit', array('id' => $user->id)); ?>"><?php echo $this->escapeHtml($user->first_name . ' ' . $user->last_name); ?></a></td>
        <td><?php echo $this->escapeHtml($user->email); ?></td>
        <td>
            <select name="level">

            <?php $level = $this->escapeHtml($user->level); ?>

            <?php if ($level == 1): ?>
                 <option value="1" selected="selected">Administrator</option>
                 <option value="2">Manager</option>
                 <option value="3">HR Staff</option>
             <?php elseif ($level == 2): ?>
                 <option value="1" >Administrator</option>
                 <option value="2" selected="selected">Manager</option>
                 <option value="3">HR Staff</option>
               <?php elseif ($level == 3): ?>
                 <option value="1" >Administrator</option>
                 <option value="2" >Manager</option>
                 <option value="3" selected="selected">HR Staff</option>
                <?php endif; ?>
            </select>
        </td>
        <td style="text-align: right;">
            <a href="<?php echo $this->url('user/delete', array('id' => $user->id)); ?>" class="btn btn-mini btn-danger" rel="tooltip" title="Delete this user"><i class="icon-remove icon-white"></i></a>
        </td>
    </tr>
    <?php endforeach; ?>
    </table>
<?php else: ?>
<h3>There are no registered users available.</h3>
<?php endif; ?>

Thanks in Advance


Solution

  • create javascript function and put function in select box onchange event.

    check working example on fiddle

    <script>
     function changeTest(obj){
        alert(obj.options[obj.selectedIndex].value);
      }
    </script>
    
     <select name="level" onChange="changeTest(this)">
       <option value="1" selected="selected">Administrator</option>
                 <option value="2">Manager</option>
                 <option value="3">HR Staff</option>
     </select>