Develop Reference

Codeigniter load page from another server

Newbie and Need helps for Codeigniter and Javascript, i need load page from another server with CI too..
What should i do to make it works...
$("#select").change(function(){
if($('#textbox').val() == ""){
alert("Warning");
return;
}else{
$('#overlay').show();
var tglpayslip = $('#tglpayslip').val();
var url = "http://192.168.88.7/index.php/home/payslip.php";
$.post(url, tglpayslip, function(response){
$('#overlay').hide();
$('#payslip').html(response);
});
}
});

For cross domain, you have to use JSONP.
$("#select").change(function(){
if($('#textbox').val() == ""){
alert("Warning");
return;
}else{
$('#overlay').show();
var tglpayslip = $('#tglpayslip').val();
var url = "http://192.168.88.7/index.php/home/payslip.php";
$.ajax({
type:"post",
url:url,
dataType: "jsonp",
data:tglpayslip,
success:function(response){
$('#overlay').hide();
$('#payslip').html(response);
}
});
}
});

Try this
var tglpayslip = $('#tglpayslip').val();
var url = "http://192.168.88.7/index.php/home/payslip.php";
$.ajax({
crossDomain: true,
type:"post",
url:url,
dataType: "jsonp",
data:tglpayslip,
success:function(response){
$('#overlay').hide();
$('#payslip').html(response);
}
});

Add one or two more PHP variables to the javascript code

I am a decent PHP programer and recently I got stuck in a javascript code.
I have the code below:
$(function () {
$('.more').live("click", function () {
var ID = $(this).attr("id");
if (ID) {
$("#more" + ID).html('<img src="moreajax.gif" />');
$.ajax({
type: "POST",
url: "scripts/loadmore.php",
data: "lastmsg=" + ID,
cache: false,
success: function (html) {
$("div#updates").append(html);
$("#more" + ID).remove();
}
});
} else {
$(".morebox").html('The End');
}
return false;
});
});
This code submit without problems one PHP variable to the process page loadmore.php using this input
<div id="more<?= $load_id ?>" class="morebox" style="margin-bottom: 200px;">
<a href="#" class="more" id="<?php echo $load_id; ?>">
load more
</a>
</div>
How can put more variables in the input and the javascript code to work with them on the process page?
I want to set one or two more variables.
UPDATE:
I updated the code like this:
HTML input:
<div id="more<?= $load_id ?>" class="morebox" style="margin-bottom: 200px;">
load more</div>
JAVASCRIPT CODE:
<script type="text/javascript">
$(function() {
$('.more').live("click",function()
{
var ID = $(this).attr("data-id");
var ACT = $(this).attr("data-act");
if(ID)
{
$("#more"+ID).html('<img src="moreajax.gif" />');
$.ajax({
type: "POST",
url: "scripts/loadmore.php",
data: {"lastmsg="+ ID, "act="+ ACT},
cache: false,
success: function(html){
$("div#updates").append(html);
$("#more"+ID).remove();
}
});
}
else{
$(".morebox").html('The End');
}
return false;
});
});
</script>
I am not sure if the data lines was writed properly because the script looks like it's frozen now
SOLVED:
I just used a datastring like this
<script type="text/javascript">
$(function() {
$('.more').live("click",function()
{
var ID = $(this).attr("data-id");
var ACT = $(this).attr("data-act");
var dataString = 'lastmsg='+ ID + '&act=' + ACT;
if(ID)
{
$("#more"+ID).html('<img src="moreajax.gif" />');
$.ajax({
type: "POST",
url: "scripts/loadmore.php",
data: dataString,
//data: {"lastmsg="+ ID, "act="+ ACT },
cache: false,
success: function(html){
$("div#updates").append(html);
$("#more"+ID).remove();
}
});
}
else{
$(".morebox").html('The End');
}
return false;
});
});
</script>

Just send data as an object:
data: {
"lastmsg": "lastmsg="+ ID,
"anotherData": "someData"
}
You'll retrieve them in your PHP script as follows:
$_POST["lastmsg"];
$_POST["anotherData"];

loading div not working on jquery

my html:
<span id="loading"><img src="ajax-loader.gif" /> Please Wait</span>
#loading{display:none;}
my js:
var Progressajax = false;
$(function() {
$(".commentmoreview").click(function(){
if(Progressajax) return;
Progressajax = true;
var element = $(this);
var id = element.attr("id");
$('#loading').show();
var value = $('.pagecont'+id).val();
var info = 'id='+id+'&pagecont='+value;
$.ajax({
type: "POST",
url: "php-comments/php/loadmorecomments.php",
data: info,
success: function(data){
$('#loading').hide();
Progressajax = false;
value = parseInt(value)+parseInt(5);
$('.pagecont'+id).val(value);
$(data).hide().prependTo('#loadmorecomments'+id).fadeIn(1000);
//$('#loadmorecomments'+id).prepend(data);
}
});
});
});
what is wrong that loading span is not working?
thank you friends!

The best way to show loader image while making ajax calls is using Ajax Global Events
$(document).bind("ajaxSend", function(){
$("#loading").show();
}).bind("ajaxComplete", function(){
$("#loading").hide();
});

can you change
$('#loading').show();
to
$('#loading').attr("display","block");
and try to use it like this
$.ajax({
type: "POST",
url: "php-comments/php/loadmorecomments.php",
data: info,
beforeSend: function(){
$('#loading').attr("display","block");
},
success: function(data){
$('#loading').attr("display","none");
Progressajax = false;
value = parseInt(value)+parseInt(5);
$('.pagecont'+id).val(value);
$(data).hide().prependTo('#loadmorecomments'+id).fadeIn(1000);
//$('#loadmorecomments'+id).prepend(data);
}
});

Why does my script not pass a value to PHP?

I want to get the value of an href using java script and then pass it to another file of php, I did the code of JS and some friend add J query to it, in order to pass the value to the test.php file, but I don't why it is not working.
<script>
$(function(){
$('div#tabs ul li a').click(function() {
var n = $(this).attr('href');
var p=n.slice(5,6);
alert(p);
$.ajax({
type: 'post',
url: 'test.php'
data: {value : p}
success: function(data) {
//do something with response 'data'
}
});
});
</script>

You're missing a final }); (and a few commas) in your code example. It should look like this:
<script>
$(function(){
$('div#tabs ul li a').click(function() {
var n = $(this).attr('href');
var p = n.slice(5, 6);
alert(p);
$.ajax({
type: 'post',
url: 'test.php',
data: {value : p},
success: function(data) {
// Do something with response 'data'
}
});
});
});
</script>

When creating a set in javascript, the key/value pairs need commas:
<script>
$(function(){
$('div#tabs ul li a').click(function() {
var n = $(this).attr('href');
var p=n.slice(5,6);
alert(p);
$.ajax({
type: 'post',
url: 'test.php',
data: {value : p},
success: function(data) {
//do something with response 'data'
}
});
});
});
</script>

jquery this selector after clicked element removed

I want to empty content of div with class dialogBody and then append returned ajax response. See the code below please. The problem I have is .html(response) doesn't do anything because clicked element is removed. How can I carry over the target element which is $this.closest('.dialogBody') after clicked element was removed?
<div class="dialogBody">
<p>Some contentClick to show question</p>
</div>
<script>
$(".ajaxReplace").live("click", function(e){
e.preventDefault();
var $this = $(this);
$this.closest('.dialogBody').empty();
ajaxUrl = $(this).attr("href")+"?ajax=1";
$.ajax({
type: "POST",
url: ajaxUrl,
success: function(response){
$this.closest('.dialogBody').html(response);
console.log(response);
}
})
});
</script>

Assign it to a variable:
$(".ajaxReplace").live("click", function(e){
e.preventDefault();
var $this = $(this);
var $dBody = $this.closest('.dialogBody').empty(); // <------
ajaxUrl = $(this).attr("href")+"?ajax=1";
$.ajax({
type: "POST",
url: ajaxUrl,
success: function(response){
$dBody.html(response); // <------
console.log(response);
}
})
});

Save a reference to the element you need instead of saving a reference to the element that will be removed:
$(".ajaxReplace").live("click", function(e){
e.preventDefault();
var ajaxUrl = $(this).attr("href")+"?ajax=1",
$thisDialog = $(this).closest('.dialogBody').empty();
$.ajax({
type: "POST",
url: ajaxUrl,
success: function(response){
$thisDialog.html(response);
console.log(response);
}
})
});
You'd also need to move the ajaxUrl assignment to before you remove the this element.