I am trying to set jQuery Ajax post URL.But it is not working as I want. I searched a lot and I got many solution.But none of them indicate my problem.
I set the base URL in var baseurl = "<?php print base_url(); ?>"; in js file and use it in $.ajax url concatenating it.It gives me
Disallowed Key Characters.php_print_base_url();_?>welcome/add_tag
I think the var baseurl is not working.
html
<script src="<?php echo base_url();?>js/my_js.js"></script>
<input type="text" id="add_tag" placeholder="add more tags"/>
js
var baseurl = "<?php print base_url(); ?>";
$('#add_tag').on('keyup paste', function () {
tag_text=$(this).val();
if(tag_text==='')
return;
$.ajax(
{
type: "POST",
url: baseurl+"welcome/add_tag",
data: {tag_textTo:tag_text},
success: function(data){
$('.tags_found').html(data);
}
});
});
CI_Controller
class Welcome extends CI_Controller {
public function add_tag()
{
$tag_text=$this->input->post('tag_textTo');
echo $tag_text;
}
}
How to make it work?thanks in advance.
You should declare the baseurl like this
var baseurl = '<?=base_url()?>';
or
var baseurl = "<?php echo base_url(); ?>";
And inside the jquery ajax call
url: baseurl+"welcome/add_tag",
Else totally
url: <?php echo base_url();?>"welcome/add_tag",
Note :
Don't forget to load the url helper
problem found
I am using an external js file for ajax call.
Now I know codeIgniter url helper does not recognize my baseurl variable in external js file.
That is line
var baseurl = "<?php print base_url(); ?>";in external file.
The answer given by #Sulthan Allaudeen and #saravanan n (thanks to them)all are working when I declare the baseurl var
in my php view file internally.
view file
<script type="text/javascript">var baseurl = "<?php print base_url(); ?>";</script>
The remaining js code can be stay on external file.
$('#add_tag').on('keyup paste', function () {
tag_text=$(this).val();
if(tag_text==='')
return;
$.ajax(
{
type: "POST",
url: baseurl+"welcome/add_tag",
data: {tag_textTo:tag_text},
success: function(data){
$('.tags_found').html(data);
}
});
});
Try with site_url
url: "<?php echo site_url('welcome/add_tag');?>"
Related
I am reviewing a web page that uses javascript, php, ajax and that with php5 worked correctly, but having updated to php7 no longer works.
I comment the details below:
In the screen I am reviewing, MyWebPage/Folder1/protected/views/applications/file1.php is executed which assigns to the variable $load this value:
$load='protected/views/aplicaciones/cargas/file2.php';
At the end of this php there is a block of code where it call several javascript libraries and then assign value to various dynamic variables, using this code:
<script type="text/javascript">
var startTime = "<?php echo $INIT; ?>";
var endTime= "<?php echo $END; ?>";
var period="<?php echo $PERIODUSED; ?>";
var db="<?php echo $DATABASE; ?>";
var loadpage="<?php echo $loadpage; ?>";
</script>
So this php calls the file3.js javascript using this code:
<script type="text/javascript" src="protected/views/aplicaciones/aplicacionesjs/file3.js"></script>
This javascript theoretically calls file2.php, using this code:
function requestData()
{
waitingDialog({});
$.ajax({
data: "startTime="+startTime+"&endTime="+endTime+"&period="+period+"&db="+db+"",
type: "POST",
url: loadpage,
datatype: "json",
success: function(data)
{
closeWaitingDialog();
var json= eval(data);
// Process and paint json
// ...
},
error: function()
{
closeWaitingDialog({});
},
cache: false
});
With Firebug I see that loadpage = protectec/views/aplicciones/cargas/file2.php
that looks to be right.
However, the problem is that after the line
var json= eval(data);
the value of json is undefined and instead of this it should contain a series of data that should be displayed on the page.
From the tests I have done with Firebug it seems to me that the problem could be that protectec/views/applications/loads/file2.php is not being executed.
Any comment or suggestion is appreciated.
I want to develop a Wordpress plugin. So, I want to call Ajax function when I click on button in my php code.
This is my php code:
function unilang_translation_page() {
echo '<div class="wrap"><h1>Translations of strings</h1> </div>';
$unilang_table_strings = new Unilang_Table_Strings;
$unilang_table_strings->prepare_items();
$unilang_table_strings->display();
$_SESSION['store_table_strings'] = serialize( $unilang_table_strings );
echo "<a type='button' class=\"button button-primary\" onClick=\"Utility.saveStringTranslations();\">Submit Changes</a>";
}
And this is my javascript file:
var Utility = {
saveStringTranslations: function() {
$.ajax({
type: "POST",
url: "/unilang/php/unilang-save-string-translations.php",
success: function(data) {
alert(data);
},
error: function(error) {
alert(error);
}
})
}
}
When I click on the button the browser console returns this:
I tried to change path but it doesn't works.
How can I set my plugin path in the URL?
Try declaring a JavaScript variable in your plugin PHP file like below
<script> var plugin_url = '<?php echo plugins_url( '/unilang/php/unilang-save-string-translations.php', __FILE__ ) ?>'; </script>
and call the plugin_url variable in the AJAX URL path - url: plugin_url + "/unilang/php/unilang-save-string-translations.php".
Hope this helps and you can read more here - https://codex.wordpress.org/Function_Reference/plugins_url.
I am a ajax beginner, Here I am trying to show a text box value in same page using Ajax.
My Controller code:
<?php
class Merchant extends CI_Controller
{
public function ajaxtest()
{
$this->load->helper('url');
$this->load->view('ajaxtest');
$fullname = $this->input->post("fullname");
echo $fullname;
}
}
?>
Here is my view code:
<head>
<script src="<?php echo base_url();?>assets/js/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#getinfo").click(function()
{
$.ajax({
type: "POST",
url: "<?php echo base_url(); ?>merchant/ajaxtest",
data: {textbox: $("#fullname").val()},
dataType: "text",
cache:false,
success:
function(data){
$('#mytext').html(data);
}
});
return false;
});
});
</script>
</head>
<body>
<form method="post">
<input type="text" id="fullname"/>
<input type="button" value="getinfo" id="getinfo"/>
<span id="mytext"></span>
</form>
</body>
When I click on the button getinfo, I want to show the text inside the text box as span text. But now it shows nothing..
Updated:
After experts' opinion, I edited some text(see my edit note), Now When i click on the button, it shows again a textbox and a button.. !!
Did you set the base_url variable with a link on the Javascript?
Because your post url contains this variable and you need set this to make it work. So initialize the variable with the base_url link.
See the corrected example below . Set your domain instead of the yourbaseurl.com
<script type="text/javascript">
$(document).ready(function(){
var base_url='http://yourbaseurl.com/index.php/';
$("#getinfo").click(function()
{
$.ajax({
type: "POST",
url: base_url + "merchant/ajaxtest",
data: {textbox: $("#fullname").val()},
dataType: "text",
cache:false,
success:
function(data){
$('#mytext').html(data);
}
});
return false;
});
});
</script>
Your base_url variable seems to be undefined in your JavaScript.
One simple approach to get the base URL is to echo it out in a hidden input, and then grab the value of that input in your JS code:
HTML
<input type='hidden' id="baseUrl" value="<?php echo base_url(); ?>" />
JS
var base_url = $('#baseUrl').val();
$.ajax({
type: "POST",
url: base_url + "/merchant/ajaxtest",
data: {textbox: $("#fullname").val()},
dataType: "text",
// ...
you are passing in textbox as parameter from your ajax to controller and trying to get POST data with name fullname. That wont work, since you passed in the name of parameter as textbox, access that in your post, as :
class Merchant extends CI_Controller
{
public function ajaxtest()
{
$this->load->helper('url');
//you dont need to load view so comment it
//$this->load->view('ajaxtest');
$fullname = $this->input->post("textbox"); //not fullname
echo $fullname;
}
}
js
<script type="text/javascript">
$(document).ready(function(){
var base_url='http://yourbaseurl.com/index.php/';
$("#getinfo").click(function() {
var fullname = $("#fullname").val();
alert("Fullname:" + fullname); //do you get this alert
$.ajax({
type: "POST",
url: base_url + "merchant/ajaxtest",
data: {textbox: fullname},
cache:false,
success:function(data){
alert("Response:" + data); //do you get this alert
$('#mytext').html(data);
}
});
return false;
});
});
</script>
Try using this:
<base href="<?=base_url();?>">
<script src="assets/js/jquery-latest.min.js"></script>
And this in ajaxtest:
$this->load->helper('url');
And also Comment out this:
// $this->load->view('ajaxtest');
Might be a little late with this response - but someone might find this while searching for a solution.
I was having the same issues with Codeigniter and JQuery ajax/post response. I could not get this to work no matter what I tried.
In the end, it turned out to be php_error that was causing the problem. Once I removed it, everything worked fine with my post/response.
I have this JavaScript code inside an html and PHP page. But I've been told that it will works only if I had an internet connection, so the solution was to make a .JS file and include this file inside the page like that:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="/clinic form/appoint/dropscript.js">
</script>
Now I got an error while testing the page offline.
The JS file is taken from this link:
multiple java script in one page error
And the final code is:
$(document).ready(function(){
$("#Date").change(function(){
var seldate =$(this).val();
display_data(seldate);
});
// This is the function...
function display_data(seldate) {
$("#scheduleDate").html(seldate);
var dataString = 'seldate='+ seldate;
$.ajax({
type: "POST",
url: "getdata.php",
data: dataString,
cache: false,
success: function(data) {
$("#Schedule").html(data);
}
});
}
// Now here is the real code for retaining your Date...
/*<?php
if (!empty($_GET['date'])) {
?>
display_data('<?php echo $_GET["date"]; ?>')
<?php
}
?>*/
document.getElementById('Date').value = '<?php echo #$_GET["date"]; ?>';
});
$(document).ready(function(){
$("#Name").change(function(){
var selname =$(this).val();
display_name(selname);
});
// This is the function...
function display_name(selname) {
$("#scheduleName").html(selname);
var dataString = 'selname='+ selname;
$.ajax({
type: "POST",
url: "getdatabyname.php",
data: dataString,
cache: false,
success: function(data) {
$("#Schedule").html(data);
}
});
}
});// JavaScript Document
P.S. I am totally new to JS and I am experimenting.
Go to https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js, hit CTRL+S, move saved file to your project's directory and then include it as you did with dropscript.js.
Also do the same with the font if you need it. Include it into your CSS file using #font-face. More information: https://developer.mozilla.org/en-US/docs/Web/CSS/#font-face
I use this button in jason.
<button id="bid" type="button" class="button" onclick="connect()">Save</button>
It show altert when I use alert after document.getElementById. But it not works in ajax function. Here is my connect function
function connect()
{
var BID = document.getElementById('BID').value;
var REF = document.getElementById('ref_po').value;
var POU = document.getElementById('po_units').value;
//**alert(BID + REF + POU);**
var url ='<?php echo base_url()."index.php/main/transacIn/" ?>';
$.ajax({
type: "POST",
url: url,
data: 'BID='+BID +'&REF='+REF +'&POU='+POU,
success: function(data) {
//$("#bid").hide();
alert(BID);
}
});
}
alert(BID + REF + POU); this alert works but not works alert in success. And it don't sent any data into controller. Help me about it. Thanks in advance.
try this
function connect()
{
var BID = document.getElementById('BID').value;
var REF = document.getElementById('ref_po').value;
var POU = document.getElementById('po_units').value;
var site_url = document.getElementById('site_url').value;
var url = site_url+'main/transacIn';
$.ajax({
type: "POST",
url: url,
data: {
BID : BID ,
REF: REF,
POU:POU
},
success: function(data) {
//$("#bid").hide();
alert(BID);
},
error: function(err) {
console.log(err);
}
});
}
you should a hidden field in your corresponding page <input id="site_url" type="hidden" value="<?php echo site_url(); ?>"/>
You cannot inject the php syntax into javascript file. Either you define the script in codeigniter template file as
<script type="text/javascript">
// Your javascript function
</script>
...or you can define a javascript variable in the template file which actually get the path to your controller:
var url = <?php echo base_url()."index.php/main/transacIn/" ?>';
Then on your javascript file on ajax post you are pointing to the variable defined in the template file:
$.ajax({
type: "POST",
url: url,
data: 'BID='+BID +'&REF='+REF +'&POU='+POU,
success: function(data) {
//$("#bid").hide();
alert(BID);
}
});
Hope you got the idea.
Anyway you need to be careful defining global variables. It's a good practice to guard the variables by using namespaces.
Try this solution. It will work:
$.post(url , {BID: BID, REF: REF, POU:POU },
function(data){
alert(BID);
});