jQuery ReferenceError: function is not defined

Question

I have a simple jquery function that reflects the selected value of a dropdown to textbox but the problem is that the console says that my function was undefined. I put the function inside the onchange event of the dropdown. Please note that all of my jquery functions was on the bottom of the page..

and here is the dropdown:

<div class="form-group">
      <label class="control-label">Operation</label>
        <select class="form-control" id="operationName" name="operationName">
       <option value="">-SELECT-</option>
        <?php
         foreach($operation as $val)
         {
          ?>
          <option value="<?php echo $val['OperationName'];?>"><?php echo $val['OperationName'];?></option>
          <?php
         }
      ?>
      </select>
          <span class="text-danger"><?php echo form_error('operation');?></span>
          <input type="text" class="form-control" id="deldays" name="deldays" 
          value="" />

this is the operation array model

function getDeliveryDays($str) { $this->db->select('DeliveryDays'); $this->db->from('operation'); $this->db->where('OperationName',$str); return $this->db->get()->result(); }

this is the controller:

public function getDays()
{
    $id = $this->input->post('q');
    $data['days'] = $this->wip_model->getDeliveryDays($id);

    echo json_encode($data);
}

I took the working in my other project and use it in my current project but still the same result and when I inspect it in the dev tools, the said script is missing in view source but it's present in IDE:

this is the code:

function showDeliveryDay(operation)
    {
        $.ajax({
            type: "POST",
            url: "<?php echo site_url('wip/getDays/');?>",
            data: {q:operation},
            success: function(data){
                console.log(data);
            },
        });
    }

Thanks in advance....

what do you mean by before html? I put all of my jquery functions at the bottom of the page before the closing body. — SilverRay
– SilverRay, Commented Feb 24, 2016 at 3:57

Norlihazmey Ghazali · Accepted Answer · 2016-02-24 03:55:57Z

1

Does you put the function inside domready? If so, remove that and placed it outside like so :

<script>
  function showDays() {
     var x = document.getElementById("operationName").value;
     document.getElementById("deldays").innerHTML = x;
  }

 // domready here
 $(function(){...}); // or $(document).ready(function(){...});     
</script>

answered Feb 24, 2016 at 3:55

Norlihazmey Ghazali

9,0701 gold badge26 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

SilverRay Over a year ago

I tried that dom ready but same results still prompts that the function is undefined that's why I revert to simple script but still the same outcome...

Norlihazmey Ghazali Over a year ago

So, you tried already put outside ondomready? Usually those errors come from that case. Can you reproduce code on jsfiddle.net

SilverRay Over a year ago

I just followed this tutorial in w3schools.com/jsref/event_onchange.asp

Norlihazmey Ghazali Over a year ago

That tutorial working great. Can you post the whole js code between <script></script> tag that you make so far.

SilverRay Over a year ago

I tried the code of WsdmLabs but it display nothing on the textbox and also I am using the new version of jquery library jquery-1.12.0.min.js if it does affect the whole process....

devpro · Accepted Answer · 2016-02-24 06:24:01Z

1

Make sure you are including your jquery in your code. try this:

jQuery( document ).ready(function() {    
	jQuery( "#operationName" ).change(function() {
     var pVal = jQuery("#operationName").val();
     jQuery("#deldays").val(pVal);     
     });  

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
<label class="control-label">Operation</label>
<select class="form-control" id="operationName" name="operationName">
<option value="">-SELECT-</option>


<option value="one">1</option>
<option value="two">2</option>
<option value="three">3</option>

</select>
<span class="text-danger"></span>
<input type="text" class="form-control" id="deldays" name="deldays" 
value="" />

</div>

answered Feb 24, 2016 at 6:24

devpro

16.1k3 gold badges29 silver badges39 bronze badges

12 Comments

SilverRay Over a year ago

I am using the new jquery library or i must use the one that you mention?

SilverRay Over a year ago

I tried the code and it's working if it's just as it is but I am loading my options value from database and when I modified the code with data from db, it's not working.....

devpro Over a year ago

@SilverRay: than plz show the actual code in your question plz

SilverRay Over a year ago

that's the actual code already that I post in my question... please see my poost....

devpro Over a year ago

@SilverRay: in your code plz remove onchange="showDays()" from select box

|

Domain · Accepted Answer · 2016-02-24 04:35:36Z

0

You can refer this code

Html

<div class="form-group">
      <label class="control-label">Operation</label>
        <select class="form-control" id="operationName" name="operationName">
       <option value="">-SELECT-</option>


          <option value="one">1</option>
               <option value="two">2</option>
                    <option value="three">3</option>

      </select>
          <span class="text-danger"></span>
          <input type="text" class="form-control" id="deldays" name="deldays" 
          value="" />

Js code

jQuery( document ).ready(function() {    
     jQuery('#operationName').on('change', function(){    
     var p=jQuery(this).val();
     jQuery("#deldays").val(p);     
     });   

});

You can view demo here

answered Feb 24, 2016 at 4:35

Domain

11.8k3 gold badges26 silver badges45 bronze badges

2 Comments

SilverRay Over a year ago

I tried you code no errors on console but it doesn't display anything in textbox....

SilverRay Over a year ago

I tried using your code with foreach and I am having an error but when I replace it with while loop it works perfectly using plain php but I don't know how when using codeigniter...

Collectives™ on Stack Overflow

jQuery ReferenceError: function is not defined

3 Answers 3

5 Comments

12 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

12 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related