How to access AJAX file from different folder in CodeIgniter - php

Question

I have one form with Jquery validation which is working perfectly, Even AJAX is also working perfectly if I use my validation code with AJAX on the same page.
Now What I did, I create a file called as validation.js and I added my validation code with AJAX in it and I added a script like below in my view page.
<script type="text/javascript" src="<?php echo base_url() ?>js/validation.js"></script>
Then I clicked on submit button It's checked my validation even it also goes to AJAX URL which I entered but this time I haven't got output.
I am getting in Network tab in the browser my URL like this
<?php echo base_url("index.php/user_control/admin_submit_from"); ?>
I am using sublime text editor If I used above URL on the same page then the base_url color is showing in blue and If I used in validaion.js the color is showing in yellow.
Above URL Is not working from the validation.js file. Would you help me in this?
My Jquery validation with AJAX
$(document).ready(function() {
$("form[name='admin_form_submit']").validate({
rules: {
firstname: {
required: true,
minlength:3,
maxlength:50
},
lastname: {
required: true,
minlength:3,
maxlength:50
},
role:{
required: true
},
inst_name:{
required: true
}
},
submitHandler: function(form) {
//// form.submit();
$.ajax({
type: 'post',
url: '<?php echo base_url("index.php/user_control/admin_submit_from"); ?>',
data: $('form[name="admin_form_submit"]').serialize(),
success: function (data) {
alert(data);
}
});
}
})
});

Answer 1

The reason why the code worked in the first method was because it was included within a PHP file. Within a php file, you can embed HTML, CSS, JS, and that's why when you write something like this:
<script src='<?php echo $something; ?>'></script>
the value of that $something is echoed.
On the other hand, you cannot embed a php code inside a javascript file. The entire code will be treated as a string, and the reason why it is parsed that way.
So to solve you issue (if you still want to put your js in a separate file), one of the ways to do that is to add a hidden input with your desired value, in your form, and use js to get it.
In your form:
<input type="hidden" name="my_url" id="my_url" value="<?php echo base_url("index.php/user_control/admin_submit_from"); ?>">
Then you target it from your js file like so:
var myUrl = $('#my_url').val();
then update your ajax to:
$.ajax({
// other objects and properties
url: myUrl,
});

Answer 2

you can't execute php in a js file
create a global js variable in your php file with the url and reference that in your js file
index.php
<script>
var url = '<?php echo base_url("index.php/user_control/admin_submit_from"); ?>';
</script>
validation.js
$.ajax({
type: 'post',
url: url,
data: $('form[name="admin_form_submit"]').serialize(),
success: function (data) {
alert(data);
}
});
}