如何将值从Codeigniter的form_hidden传递给javascript？

Question

I want to pass the value of my form_hidden from the view to a javascript function.

VIEW:

<?php echo validation_errors(); ?>
<?php

  $mode                 = (isset($is_editing))? 'disabled' : 'disabled';
  $client_name          = (isset($is_editing))? $clientcontent->client_name : NULL;
  $process              = (isset($is_editing))? 'Edit' : 'Add';
  $form_action          = (isset($is_editing))? 'client/update_client/' . $id : 'client/create_client';

?>
<style type="text/css">
  .check_exists
  {
    margin-top: 4px;
    margin-left: 9px;
    position: absolute;
    width: 16px;
    height: 16px;
  }
</style>
<?php echo form_open($form_action, 'id="frm" class="form-horizontal" style="margin: 0;"'); ?>
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
    <h4 class="modal-title"><?php echo $process ?> Client</h4>
  </div>
  <div class="span6" style="padding-top:20px;padding-bottom:10px;">
    <!-- Project Content Fields -->
    <div class="control-group">
      <p class="control-label">Client Name*</p>
      <div class="controls">
        <?php echo form_input('client_name', $client_name, 'id="client_name" style="height: 30px;"'); ?><span id="client_verify" class="check_exists" ></span>
      </div>
    </div>

    <?php echo form_hidden('old_name',$client_name); ?>

  </div>
<?php echo form_close(); ?>

   <script type="text/javascript">
  $(document).ready(function()
  {
    check_client("#client_name", "<?php echo base_url(); ?>client/check_availability", "#client_verify", "#old_name");
  })
// </script>

Javascript File:

function check_client( id, url, spanid, old)
{

  var oldname = $(old).val();

  $('body').on('keyup', id, function(){
    if($(id).val().length >= 3)
    {
      var newname = $(id).val();
      console.info("The new name is " + newname + ":old name is" + oldname);

      $.ajax({
        url     : url,
        data    : {client_name : $(id).val()},
        type    : 'POST',
        success : function(data){
            if( data.is_available == 0 ){ // Here
                      //start fading the messagebox
                      $(spanid).css({ "background-image": "url('http://localhost/mapmces_3.4.2/assets/img/no.png')" });
                      $(spanid).attr( "title", "Already Exists" );
                      available = false;

                  }else if( data.is_available ){ // Here the json response
                     //start fading the messagebox

                     $(spanid).css({ "background-image": "url('http://localhost/mapmces_3.4.2/assets/img/yes.png')" });
                     $(spanid).attr( "title", "Available" );
                     available = true;

                   }else{
                    alert("Some error occured! Check Console");
                    console.error(data.reason);
                  }
                }
              });
    }
    else
    {
      $(spanid).css({ "background-image": "none" });
    }
  });
}

Everything works fine. No errors are displayed by firebug. The function also works, but i want to add another validation which is checking if the oldname = newname. The function is able to get the value of the newname but it can't get the value of oldname which is from form_hidden.

Please tell me what I'm doing wrong. Many thanks!

Answer 1

What I would do is load the script in. after that, in your html, create some script tags and echo your form-hidden to a variable.

ex.

    <script src='main.js'></script>
    <script>
      var hello=<?php echo form_Hidden; ?>;
      thisIsAFunction(hello);
    </script>
  </body>
</html>

Answer 2

Just changed

 <script type="text/javascript"> $(document).ready(function() { check_client("#client_name", "<?php echo base_url(); ?>client/check_availability", "#client_verify", "#old_name"); }) </script> 

into

 <script type="text/javascript"> var old_name = "<?php echo $client_name; ?>"; $(document).ready(function() { check_client("#client_name", "<?php echo base_url(); ?>client/check_availability", "#client_verify",old_name); }) </script>