My Javascript Code is like this :
$(".booking_hotel").click(function(){
var id = this.id;
$.ajax({
type: "POST",
url: base_url + 'hotel_booking/hotel/hotel_booking',
data: id
});
});
Function in my controller is like this :
function hotel_booking()
{
$data = $this->input->post();
$data = array(
'hotel_request' => $data,
);
$this->load->view('hotel_booking/booking_hotel_view',$data);
}
It not successful to load view. But in console firebug(tab html), the view could appear.
How to load view booking_hotel_view when class .booking_hotel clicked?
Thank you
The view from ajax comes to you as ajax response. You have to put it in your desired place.
Let you have div with id="my_div" and you want to show your view in this div. So your code will be
$(".booking_hotel").click(function(){
var id = this.id;
$.ajax({
type: "POST",
url: base_url + 'hotel_booking/hotel/hotel_booking',
data: id
}).done(function(response){
$('#my_div').html(response);
});
});
try this. It will reload/redirect to you hotel_booking/hotel/hotel_booking. i.e load your booking_hotel_view
$(".booking_hotel").click(function(){
var id = this.id;
$.ajax({
type: "POST",
url: base_url + 'hotel_booking/hotel/hotel_booking',
data: id
}).done(function(response){
window.location.href = "hotel_booking/hotel/hotel_booking";
});
});
As you doing nothing with your ajax post data you may use as
$(".booking_hotel").click(function(){
window.location.href = "hotel_booking/hotel/hotel_booking";
});
Related
I am using FPDF to create my report.
$pdf = new Report('P','mm','A4', $_POST);
$pdf->AddPage();
$pdf->Output('file.pdf','I');
And I use ajax to make requisition to the PHP.
$.ajax({
type: 'POST',
url: '../reports/report.php',
data: { id: id }
}).done(function(data){
window.open(data);
})
I want to show the report in a new tab
I think you should success key. So it would be something like this
$.ajax({
type: 'POST',
url: '../reports/report.php',
data: { id: id },
success: function(data){
var blob = new Blob([data]);
window.open(URL.createObjectURL(blob));
}
})
Resolved:
I did the different way:
In my report PHP, I generate one temporay file, passing the parameter 'F'.
$pdf->Output('file.pdf','F');
In Jquery Ajax I opne the file, rather than open the data retorned of ajax request.
$.ajax({
type: 'POST',
url: '../reports/report.php',
data: { id: id }
}).done(function(data){
var fileName = "file.pdf";
$('#modalRel').modal('show');
var object = "<object data=\"{FileName}\" type=\"application/pdf\" width=\"500px\" height=\"300px\">";
object += "If you are unable to view file, you can download from here";
object += " or download <a target = \"_blank\" href = \"http://get.adobe.com/reader/\">Adobe PDF Reader</a> to view the file.";
object += "</object>";
object = object.replace(/{FileName}/g, "../Files/" + fileName);
$("#body-rel").html(object);
})
I hope to have helped who one day to need.
How can I save info that I have in a div named '#time' to a database?
<div id="time" style="float:right;font-size:15px;">0:00:00</div>
The code above is a jq count up timer.
What I'm trying is to save every tick in the database.
How can I do this?
$.ajax({
type: "POST",
url: "setupcounter.php",
data: {action: 'save',
field: $("#time").val(),},
success: function(msg){
}
error: function(){
alert('error');
}
});
Actually you want to get text of div. So do this..
Just replace
$("#time").val()
with
$("#time").text()
var time = $('#time').val();
//Just add whatever params you need to the datastring variable.
var dataString = 'time='+time+'&action=save';
//Check console that you are sending the right data
console.log(dataString)
$.ajax({
type: "POST",
url: "setupcounter.php",
data: dataString,
success: function(msg){
console.log(msg);
}
});
In php you would do:
$time = $_POST['time'];
$action = $_POST['action'];
//Db stuff
Fiddle
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);
});
I am trying to pass a Javascript variable to a PHP file using AJAX.
I have the below Javascript code;
<script type="text/javascript">
var route_id = 'travelling-from'; //Route ID
$('#'+route_id).change(function(e) {
//Grab the chosen value on route change
var selectroute = $(this).val();
$.ajax({
type: "GET",
url: 'ajax-getvalues.php',
data: { selectroute : selectroute }
});
});
</script>
In my ajax-getvalues.php, I have;
$selectroute = mysqli_real_escape_string($connection, $_GET['travelling-from']);
When I try to use $selectroute, it seems to be empty.
Do I need to add something else in order for this to work? Or have I gone wrong at some point?
When I try to use $selectroute, it seems to be empty
The AJAX request will be sent to ajax-getvalues.php with the query string:
?selectroute=somevalue
In PHP you are trying the get the value of a parameter called travelling-from, this parameter does not exist in the query string.
You need to change selectroute to travelling-from
$.ajax({
type: "GET",
url: 'ajax-getvalues.php?travelling-from=' + encodeURIComponent(selectroute)
});
Or of you prefer:
$.ajax({
type: "GET",
url: 'ajax-getvalues.php',
data: {"travelling-from": encodeURIComponent(selectroute)}
});
This produces the query string ?travelling-from=somevalue which can now be accessed with $_GET['travelling-from']
In your example the key should be route_id instead of selectroute
<script type="text/javascript">
var route_id = 'travelling-from'; //Route ID
$('#'+route_id).change(function(e) { //Grab the chosen value on route change var selectroute = $(this).val();
var data = {};
data[route_id] = selectroute;
$.ajax({
type: "GET",
url: 'ajax-getvalues.php',
data: data }
}); </script>
I have a dropdown, on its change it should redirect to a page with the dropdown's value say as a POST
I tried something like this:
$(document).ready(function() {
$('some_dropdown').change(function() {
var id = $(this).val();
var datastring = 'id=' + id;
$.ajax({
type: "POST",
url: "xyz.php",
data: datastring,
cache: false,
success: function(html) {
window.location.href("xyz.php");
}
});
});
});
On the xyz.php page:
if ($_POST['id']) {
Blah Blah..
}
It's not recognizing that id value on the xyz page. I want it's value on the redirected page.
Edited - To make things more clear, I tried out to print the xyz.php's contents on my original page (instead of redirecting) like this -
$.ajax({
type: "POST",
url: "xyz.php",
data: datastring,
cache: false,
success: function(html) {
$(".somediv").html(html);
}
FYI, "somediv" was <div class="somediv"></div> in my original page(no-redirecting) and it worked!! It could identify the id. Some how can't work it out with redirecting. It can't identify the id.
Edited --
Last thing, if I don't redirect and use
$.ajax({
type: "POST",
url: "xyz.php",
data: datastring,
cache: false,
success: function(html) {
$(".somediv").html(html);
}
The data loads perfect, my question is can I make some changes in the dynamically loaded textboxes and insert them in the database
If you have to make a post request can make it by appending a virtual form.
Here is the code for that.
$(document).ready(function() {
$('[name="some_dropdown"]').change(function() {
var mval = $(this).val(); //takes the value from dropdown
var url = 'xyz.php'; //the page on which value is to be sent
//the virtual form with input text, value and name to be submitted
var form = $('<form action="' + url + '" method="post">'+
'<input type="text" name="id" value="' + mval + '" />'+
'</form>');
$('body').append(form); //append to the body
form.submit(); //submit the form and the page redirects
});
});
and on PHP
if(isset($_POST['id'])){
echo $_POST['id'];
}
Your datastring should be key value pair. Like this.
var datastring = {'id':id};
you have few mistakes in your code so your correct code will be like this
$('.some_dropdown').change(function(){
var id = $(this).val();
var datastring = 'id='+id;
$.ajax({
type: "POST",
url: "xyz.php",
data: datastring,
cache: false,
success: function(html){
window.location.href= "xyz.php?"+datastring+"";
}
});
});
});
and php code
if(isset($_GET['id'])){
Blah Blah..
}