Generate TCPDF with ajax call parameter - php

I have a post which has 3 extra custom text field and it has some content.now i have link on front and to popup that 3 fields content.When page load they are in display none mode but when i click link it opens in fancybox popup.Now i want to generate pdf of each file using tcpdf or any other easy way i am using tcpdf for my purpose but i get all 3 fields in single pdf so i use ajax when i click link it takes anchor tag value and pass to the pdf parameter via ajax but nothing seems to work here is my code for ajax call in single.php
<script type="text/javascript">
jQuery(function($){
$('nav a.cboxElement').on('click', function(){
alert('hi');
var nv = $(this).text().toLowerCase().replace(/\s+/g, "_");
alert(nv);
$.ajax({
type: "POST",
url: '<?php echo get_template_directory_uri(); ?>/popupdatatopdf.php',
data: {valueMin : nv}
}).done(function(result) {
alert(result);
console.log(result);
});
});
});
</script>
Below code if for popupdatatopdf.php i can see hello printed and can can see hello123 in pdf but the data which i got via ajax request not printing in pdf i checked in console and i can see value of request there but it does not get prited i pdf
echo "hello";
$pdfname="uu";
$mlm=$_REQUEST['valueMin'];
$nn="hell0123";
$html3.="<div style='font-size:23px;'>".$mlm.$nn."</div>";
$html3.="<div style='font-size:23px;'>ppc</div>";

Related

How to load the one page content without page refresh when another page button click

I have two pages (checkout and order page).
The checkout page contains a confirme order button. If the button is clicked the order page loads the data without a page refresh.
How can i do that. Please click me.
You can use an ajax call to get HTML from 'data.php' (or wherever you are getting your data from) and print that HTML into a div in checkout page.
$.ajax({
url: "data.php"
}).complete(function(result) {
$( div ).html(result);
});
Something similar to this.
For more on Ajax - http://api.jquery.com/jquery.ajax/
First take a simple button and call a jquery function onclick-
echo 'Click to change';
Jquery
<script type="text/javascript">
$(function() { // wrap inside the jquery ready() function
//Attach an onclick handler
$('#button').click(function(){
//Get the ID of the button that was clicked on (addition if you want any specific data, just pass that id in place of button)
var specific_id = $(this).attr("id");
$.ajax({
url: "yourPHP_data.php", //This is the page where you will handle your SQL insert
type: "POST",
data: "data=" + specific_id, //The data your sending to yourPHP_data.php
success: function(){
console.log("AJAX request was successfull");
},
error:function(){
console.log("AJAX request was a failure");
}
});
});
});
</script>
yourPHP_data.php page contain your code that you want to load and display, and you also find that data you have passed-
$data = $_POST['data'];

PHP: Load any div content by clicking <a> tag by corresponding DIV id="" in ajax?

I developed a SLIDING page site which has only one index page and 4-5 different DIV section distinguished by DIV id, here is the link: http://gosick.tk/
name: 08093103002
pass: mak
but it take quite a long time to load because the whole site is only 1 page and the full page is actually 9200 PX;
now I want to load each DIVISION by id="" wise by AJAX when I click the menu at a time or
pls give me any solution that I can speed up my content load during form action urgent
"now I want to load each DIVISION by AJAX "
$.ajax({
url: 'test.html',
dataType: 'html',
success: function(html) {
var div = $('#loadDivId', $(html)).addClass('classname');
$('#wheretoloadId').html(div);
}
});
Edit : This works only if your div is a part of ajax response?
this will open the link of anchor tag in the div content
<script>
$(document).ready(function() {
$('a').each(function(){
$(this).on("click",function(e) {
console.log(e);
e.preventDefault();
$('#content').load($(this).attr('href'));
});
});
});
</script>

loading a html page after php content is loaded

i am including a html page(say b.html) to a html page(a.html) using jquery ,the b.html page contains 6 links in it ..i want to display them below the php content of a.html,but before php content loads b.html is displayed .how can i get html page below php ??
<script>(a.html)
jQuery(document).ready(function(){
$("#includedContent").load("/templates/default/property/tab.html");
});
</script>
in html page (a.html)
<div id="includedContent"></div>
I think your problem can be resolve via ajax
<script>(a.html)
$(document).ready(function(){
$.ajax({
type: "POST",
url: '/templates/default/property/tab.html',
//or b.html
data: form_field,
success: function(d){
$('#includedContent').html(d);
},
});
});
</script>
in html page (a.html)
<div id="includedContent"></div>

Get the Width of Div and LIMIT the mySQL query according to no of elements?

I needed to display number of images in
<li><img class='1'><img class='1'><img class='1'></li>
<li><img class='1'><img class='1'><img class='1'></li>
but as my div is auto increasing according to screen width. I needed to calculate number of images to display according to the width of div , suppose width is 1200px and each image will be of 150px . so the number of image to display are 8 .
<script type='text/javascript'>
var screen_width = document.getElementById('div_1').offsetWidth();
var no_of_images =Math.round(screen_width/100);
</script>
I am getting the images from mysql database, using LIMIT query .. I want to LIMIT it to no of images i got using var no_of_images. But as their is no direct rule of integrating javascript variable into mysql query. i want to pass it to PHP variable and then use it in Mysql. But unfortunately i dont know how to do it.
You can use the document.ready event handler to make sure the DOM is ready to be manipulated and then make an AJAX request to your server-side script that could output the HTML for the correct number of images to place in the container:
//wait for the `document.ready` event to fire
$(function () {
//cache the container element since it will be used later more than once
//also get the width of the container and figure out how many 150px wide images can fit without being clipped
//note that this does not take into consideration any padding/margin/border for the images
var $container = $('#div_1'),
screen_width = $container.width(),
no_of_images = Math.floor(screen_width / 150);
//create an AJAX call to your server-side script to get the image HTML
$.ajax({
url : '<URL>',
type : 'get',//or 'post'
data : { 'no_of_images' : no_of_images },//jQuery will handle data encoding if you pass it an object
success : function (serverResponse) {
//now the AJAX request has returned successfully so this fades the container out, replaces it's HTML with the server response and then fades back in
$container.fadeOut(500, function () {
$container.html(serverResponse).fadeIn(500);
});
},
//if an error occurs with the AJAX call this is how you handle it, you may just try to re-send the AJAX call
error : function () {
alert('an error occured');
}
});
});
you can pass it as a get param when loading the page. e.g. when creating the link to load the next page just add it as param. on initial page load you get all the images bu display only the ones you need for the available resolution
You have to use AJAX.
<script type='text/javascript'>
var screen_width = document.getElementById('div_1').offsetWidth();
var no_of_images =Math.round(width/100);
$.ajax({
type: "post",
url: "script.php",
data: "no_of_images="+no_of_images,
success: function(){
// do something
}
});
</script>
You have to use jQuery to get my code working, cause i used the jQuery method $.ajax().

Download pdf file from a string using Jquery

All,
I have a PHP5 application written with Zend Framework and MVC. On my home page, I want to incorporate the functionality to download a dynamically generated pdf file. The way this is done is:
User clicks "download file" link.
On Click, an AJAX call occurs to a PHP controller, which takes the form data, generates the pdf and returns it as a string.
My javascript function now has the pdf string.
How can I display the user an "Open/Save" dialog to download the pdf file from javascript?
I have the following code:
<script type="text/Javascript">
$('#dlcontent').click(function(e) {
$.ajax({
type: 'POST',
url: "/downloads/dlpolicies",
data: $("#frmMyContent").serialize(),
cache: false,
dataType: "html",
success: function(html_input){
alert(html_input); // This has the pdf file in a string.
//ToDo: Open/Save pdf file dialog using this string..
}
});
});
</script>
Thanks
I would try to keep this simple. Just sumbit the form with a target="_blank" and then have PHP force the file download.
HTML CODE
<script type="text/Javascript">
$('#dlcontent').click(function(e) {
e.preventDefault();
$("#frmMyContent").submit();
});
</script>
<form id="formMyContent" action="/downloads/dlpolicies" target="_blank" ... >
...
</form>
Then on your server side, you need to tell PHP to send the response as a "download".
PHP Code
$this->getResponse()
->setHeader('Content-Disposition', 'attachment; filename=result.pdf')
->setHeader('Content-type', 'application/pdf');
Got this from here:
Zend Framework how to set headers
The simplest way of doing it is open a new window with URL to pdf string.
Add an element to your page where you want the link to go. It can be a span or a div or a cell in a table or whatever you want. Give it a unique ID. Then use jQuery to set the html of that element. I refer to it as somepageelement here.
$('#dlcontent').click(function(e) {
$.ajax({
type: 'POST',
url: "/downloads/dlpolicies",
data: $("#frmMyContent").serialize(),
cache: false,
dataType: "html",
success: function(html_input){
$('#somepageelement').html('Click here to download the pdf');
}
});
});

Categories