I'm currently writing a php script that is checking if there's no image in a array.
If there is no images, i need a messagebox (i use jquery msgbox) that ask if you wan't to create a product without an image.
If the user clicks yes, how do i then return true so the php code can be executed?
I know php is server side, so I "just" need your suggestion, what's the best solution here.
Currently my code is something like:
<?php if(!isset($_POST['img'] //imagearray)){?>
<script>
$.msgBox({
title: "Sure?",
content: "Add product without images?",
type: "confirm",
buttons: [{ value: "Yes" }, { value: "No" }, { value: "Cancel"}],
success: function (result) {
if (result == "Yes") {
return true;
}else{
return false;
}
}
});
</script>
<?php } ?>
Ok, here is an example,
<script>
$("#my-super-form").submit(function(event) {
if($("#id-of-your-image-input").val()=="")
if(confirm("Add product without image?")) {
return true;
} else {
return false
}
}
return true;
});
</script>
Its not tested, but I think you can figure out how it works.
If you use jQuery, you want to check if image is set after the post.
When user click is sent button, you can use your confirm messageBox, if image not found ^^
it's more intuitive for user.
Related
I want the div to change color based on the value that is retrieved from the database.
The current code doesn't give any color and uses the set css color.
Main div css
.status{ background: #000; }
status.php
if ($user_data['status'] === "1") { echo "online"; }
else { echo "offline"; }
The ajax function
$(document).ready(function() {
setInterval(function(){
$.ajax({
url: 'status.php',
type: 'GET',
success: function(data) {
if (data === "online") {
$('.status').css('background', '#40A547');
} else {
$('.status').css('background', '#7f8c8d');
}
}
});
}, 2000);
});
The main div
<div class="status">something</div>
Please help me out. All help will be much appreciated!
The problem can be identified use this code :
$(document).ready(function() {
setInterval(function(){
$.ajax({
url:'status.php',
datatype:"application/json",
type:'GET',
success:function(data){
if (data === "online") {
$('.status').css('background', '#40A547');
} else {
$('.status').css('background', '#7f8c8d');
}
},
error:function(){
//if pointer is comming it means there is some error in the back end code
}
});
}, 2000);
});
Now check your in the firebug it will show you the error details, if you don't have firebug add it and then check.
also put some content in the div so that it will be visible. If there are no content div doesn't appear.
Hope this will help!
You don't have anything in your div, so it's basically 0 height and width so you don't see anything (which is what I assume you mean by "current code doesn't give any color").
If you specify a height and width, or add something inside your div (even a , you should see the background color.
That means you are not getting 'online' back from your ajax. you need to edit your PHP code that you are AJAXing to purely say 'online', no divs or markup.
I need to be able to replace a php file with another php file based on screen resolution. This is what I have so far:
<script type="text/javascript">
function adjustStyle(width) {
width = parseInt(width);
if (width = 1920) {
$('book.php').replaceWith('book2.php');
}
}
$(function() {
adjustStyle($(this).width());
$(window).resize(function() {
adjustStyle($(this).width());
});
});
</script>
which obviously isn't working-- any ideas? Thank you in advance for any help received.
UPDATE
Is this at all close (to replace the book.php line)?
{ $("a[href*='book.php']").replaceWith('href', 'book2.php'); };
Second Update to reflect input gathered here
function adjustStyle(width) {
width = parseInt(width);
if (width == 1920) {
$('#bookinfo').replaceWith(['book2.php']);
$.ajax({
url: "book2.php",
}).success(function ( data ) {
$('#bookinfo').replaceWith(data);
});
$(function() {
adjustStyle($(this).width());
$(window).resize(function() {
adjustStyle($(this).width());
});
});
}
}
I have not seen the use of replaceWith in the context you put it in. Interpreting that you want to exchange the content, you may want to do so my using the load() function of jQuery.
if(width == 1920){
$("#myDiv").load("book1.php");
} else {
$("#myDiv").load("book2.php");
}
Clicking on the button replaces the content of the div to book2.php.
The first problem is I don't think that you are using the correct selectors. If you have the following container:
<div id="bookContainer">Contents of book1.php</div>
The code to replace the contents of that container should be
$('#bookContainer').replaceWith([contents of book2.php]);
In order to get [contents of book2.php] you will need to pull it in by ajax using the following code I have also included the line above so that the data from book2.php will be placed into the container:
$.ajax({
url: "http://yoururl.com/book2.php",
}).success(function ( data ) {
$('#bookContainer').replaceWith(data);
});.
I haven't tested this so there might be an issue but this is the concept you need to accomplish this.
First off... using a conditional with a single = (equal sign) will cause the condition to always be true while setting the value of variable your checking to the value your checking against.
Your condition should look like the following...
if (width == 1920) { // do something }
Second, please refer to the jQuery documentation for how to replace the entire tag with a jquery object using replaceWith()... http://api.jquery.com/replaceWith/
I would use a shorthand POST with http://api.jquery.com/jQuery.post/ since you don't have the object loaded yet...
In short, my code would look like the following using $.post instead of $.ajax assuming I had a tag with the id of "book" that originally has the contents of book.php and I wanted to replace it with the contents of book2.php...
HTML
<div id="book">*Contents of book.php*</div>
jQuery
function onResize(width) {
if (parseInt(width) >= 1920) {
$.post('book2.php',function(html){
$('#book').html(html).width(width);
});
}
else {
$.post('book.php',function(html){
$('#book').html(html).width(width);
});
}
}
Hope this helps.
I have a page that shows whether a user has paid or not. If they haven't paid I need to show them an image of a big red X and display a payment button, and if they have paid display a big green check. I know how to do the code for the php script, lets call it pay.php, but I need to iron out the logic for the main page's ajax. So I'm thinking something like this:
<div id="payment">
<div id="image"></div>
<div id="pay_text></div>
</div>
<script>
$(document).ready(function(e) {
if(<?php echo $is_logged_in; ?>) {
$('#payment').load(function() {
$.ajax({
data: $this.serialize(), // get the form data
type: "POST", // GET or POST
url: "Scripts/pay.php", // the file to call
complete: function(data) {
if(data=="Yes") {
$('#image') //do some jquery to make the correct image display here
$('#pay_text').text("Yah you paid");
} else {
$('#image') //do some jquery to make the correct image display here
$('#pay_text').text("Sorry you didn't pay");
}
}
});
}
}
});
</script>
So basically the script would echo back yes or no. And I only want to evaluate this load after the user has logged in (i need to see if that specific user paid). So is my logic write or am I way off?
You probably should'nt use load that way, and there really is no need for it.
Your PHP variable $is_logged_in would of course have to be true before the ajax function will run, and returning true or false is usually the way to go with code, not returning yes or no, and if data is either true or false you can stick it right in the if statement, no fuzz!
As for sending form data with the ajax function, what form? And what is $this?
You'll have to figure out if the user paid or not on the serverside, and you don't really need any data from the client to do that, all you need to do is check your database or whatever it is you're using to see if that user paid, and return true or false.
<script type="text/javascript">
$(document).ready(function() {
if(<?php echo $is_logged_in; ?>) {
$.ajax({
type: "POST",
url: "scripts/pay.php"
}).done(function(data) {
if (data) {
$('#image').css('background', 'url(/yes.png)');
$('#pay_text').text("Yah you paid");
}else{
$('#image').css('background', 'url(/no.png)');
$('#pay_text').text("Sorry you didn't pay");
}
});
}
});
</script>
I am completely new to all of this coding.. so I apologies for my ignorance in advance.
I have this jquery function (button) which changes the size of the table of where my Post.php is loaded, (to alternate between portrait and landscape). the function itself works great in changing the size however i am stuck in reloading the post.php page.
$("#cSize").toggle(
function () {
$('#p_CWidth').animate({width:720});
$('#p_SWidth').animate({width:110});
}, function() {
$('#p_CWidth').animate({width:520});
$('#p_SWidth').animate({width:310});
});
what i need to add to this code is away of changing the variable p_Type to true or false and reloading the post.php or the div p_Post
<div id="p_Post">
<? $p_type = true;
include 'profile/post.php'; ?>
</div>
post.php with the above code is loaded fine and i tested it by manually changing p_type to false/true and it loaded ok. But how can i get this automated with the jquery functoin above?
I have tried .load('profile/post.php') however this brings me an error for db access!!
any help is really appreciated
AB
UPDATE
I have changed my php file to just a simple php without any link to mysql for testing, and i have tried the suggested code:
var p_type = false;
$("#cSize").toggle(function () {
$("#p_post").load('profile/post.php',{ 'p_type' : p_type }, function {
p_type = !p_type; //toggle the value for automation
});
$('#p_CWidth').animate({width:720});
$('#p_SWidth').animate({width:110});
});
and sadly that doesnt seem to work?!!
but with some trial and error i have manged to get change in size working again, and the php reloaded for the first time with the new right variable (p_type), however for some reason the php file only loads once! so it doesnt go back to the normal size with (p_type as true after being set as false)??? here is the code:
$("#cSize").toggle(
function () {
$('#p_CWidth').animate({width:720});
$('#p_SWidth').animate({width:110});
$("#p_Post").load('profile/p_post.php',{ p_type : false });
}, function() {
$('#p_CWidth').animate({width:520});
$('#p_SWidth').animate({width:310});
$("#p_Post").load('profile/p_post.php',{ p_type : true });
});
Thank you again in advance
ps. here is the toggle example i followed http://jsfiddle.net/6FMZY/
You can add additional data to your jQuery snippet like this
$("#p_post").load('profile/post.php',{ p_type : false });
But since you are trying to automate this, while relaoding
var p_type = false;
$("#p_post").load('profile/post.php',{ 'p_type' : p_type }, function(data) {
'p_type' = !p_type; //toggle the value for automation
});
Update:
Here is a simulation of sending the data on toggle
Soooorted!
I have edited the p_post.php to make it easier by adding get function:
<?
if(isset($_GET['p_type'])){
$p_type=$_GET['p_type'];
}
if($p_type == "normal"){
// what happen here
} if($p_type == "wide"){
// what happen here
}
?>
for the jquery i used:
$("#cSize").toggle(
function () {
$('#p_CWidth').stop(true).animate({width:720});
$('#p_SWidth').stop(true).animate({width:110});
$("#p_Post").load('profile/p_post.php?p_type=wide');
}, function() {
$('#p_CWidth').stop(true).animate({width:520});
$('#p_SWidth').stop(true).animate({width:310});
$("#p_Post").load('profile/p_post.php?p_type=normal');
});
Now its working perfect and just need to sort the denied access issue for php!!
Thank you again for the help
here is my jquery $.post
$(document).ready(function() {
$("form[name=frmedit]").submit(function() {
$.post('index.php',
{
dealname: $("[name=dealname]").val(),
startdate: $("[name=startdate]").val()
},
function(data)
{
if(data.success)
{
location.href = data.redirect;
}
else
{
$("#colright #error").html(data.message);
}
}, 'json');
return false;
});
});
the php part is on the same page
if(isset($_POST['btnNext']) && ($_FILES['image']['size'] > 0))
{ //run query to save data }
so my question is can i have all this on one page?
i also have another question
where i have
$("form[name=frmedit]").submit
how can i put the name of the button btnNext in that rather than just .submit?
the reason why i want to use all this on one page is because when a submit is done i want to check
if a thumbnail uploaded is greather than 0 being that it exists, like i was normally doing.
thanks
if your ajax succeeds , then return true so that it will do form submit otherwise do a false, it won't do a form submit
function(data)
{
if(data.success)
{
return true
}
else
{
$("#colright #error").html(data.message);
return false
}
}, 'json');
return false;