I created a div for preview with PHP and now I need to display it in Dialog Jquery,is it possible to pass directly php variable in Jquery?I tried but I have as results a blank dialog!!
Jquery side :
$(function() {
$( "#previewDiv" ).dialog({
autoOpen: false,
height: 200,
width: 700,
modal: true,
buttons: {
"Submit": function() {
$( this ).dialog( "close" );
$("#submit").click();
},
"Cancel": function() {
$( this ).dialog( "close" );
}
},
close: function() {
$('#').val("");
}
});
$( "#previewButton" ).click(function() { $( "#previewDiv" ).dialog( "open" ); });
});
And PHP :
$table=$_SESSION['data'];
if (isset($_POST['preview'])) {
if ($table) {
foreach($table as $keys=>$values) {
$pieces = explode(" , ",$values);
echo "<div id='previewDiv'>"
echo "$pieces[0]";
echo "$pieces[1]";
echo "</div>";
}
}
Thank you for your help!!!
Related
I cannot find an answer in previous posts so I'll share my code and hopefully someone can tell me why my dialog won't open after I have closed it the first time.
script:
addressdialog = $( "#address-form" ).dialog({
autoOpen: false,
height: 550,
width: 450,
modal: true,
buttons: {
Submit: function(){
form[0].submit();
},
Cancel: function() {
addressdialog.dialog( "close" );
}
},
close: function() {
form[ 0 ].reset();
allFields.removeClass( "ui-state-error" );
}
});
$( "#create-address" ).click( function() {
addressdialog.dialog( "open" );
});
I can't get my html div to display.... let me know if it is required but I figure the problem is with the script.
I'm having a link as follows :
<div id="demo-testpack">
Demo Test Packages
</div>
On clicking on this link I'm calling following jQuery code :
$(function() {
$("#user-popup-login").dialog({ autoOpen: false });
$( ".user-not-loggedin" )
.click(function() {
$( "#user-popup-login" ).dialog( "option", "width", 400 );
$( "#user-popup-login" ).dialog( "option", "modal", true );
$( "#user-popup-login" ).dialog( "open" );
return false;
});
The pop up gets opened after this function some fields and some links are there in the pop up. One link is as follows in the popup:
<div id="registern">Register Now</div>
On click of this link I want to execute the following code which results in opening of another popup. The jQuery code for this is as follows :
$(function() {
$("#create-user-form").dialog({ autoOpen: false });
$( ".register-btn" )
.click(function() {
$( "#create-user-form" ).dialog( "option", "width", 560 );
$( "#create-user-form" ).dialog( "option", "modal", true );
$( "#create-user-form" ).dialog( "open" );
return false;
});
$( ".get-start" )
.click(function() {
$( "#create-user-form" ).dialog( "option", "width", 560 );
$( "#create-user-form" ).dialog( "option", "modal", true );
$( "#create-user-form" ).dialog( "open" );
return false;
});
//This function is used to submit User Registration form
$('#user_registration_form').live('submit', function() {
$('.register').attr('disabled', 'disabled');
show_request('#registration_error');
$.ajax({
type: $(this).attr('method'),
url: $(this).attr('action'),
data:$(this).serialize(),
dataType: 'json',
success: function(response) {
$('.register').removeAttr('disabled', 'disabled');
var reg_error = response.reg_error;
if(reg_error=='yes') {
var error_msg = response.error_msg;
var dialog_title = 'Input Errors Found';
var dialog_message = error_msg;
$("#registration_error").html(error_msg);
} else {
$("#registration_error").html('');
$( "#create-user-form" ).dialog('close');
var suc_msg = response.suc_msg;
var dialog_title = 'Registered Successfully';
var dialog_message = suc_msg;
var $dialog = $("<div class='ui-state-success'></div>")
.html("<p class='ui-state-error-success'>"+dialog_message+"</p>")
.dialog({
autoOpen: false,
modal:true,
title: dialog_title,
width: 500,
buttons:{
'OK': function() {
$(this).dialog('close');
}
}
});
$dialog.dialog('open');
$('#user_registration_form')[0].reset();
}
}
});
return false;
});
});
Now what I want to achieve is when user clicks on the above link the previously opened popup should close and only this new popup should display. I did lots of tricks but not succeeded. Can anyone help me out on how to achieve this?Thanks in Advance.
I'm going to guess this is scope issue because the call to popup('open') on $( "#create-user-form" ) in a different anonymous function than where you are trying to close it. Try putting the calls to open and close it in the same document.ready shorthand anonymous function.
I tried and tried and reacThis can be achieved by following code snippet. It really did magic for me.
if($( "#user-popup-login" ).dialog( "open" ))
$( "#user-popup-login" ).dialog( "close" );
I currently have a jQuery function which onclick opens a dialog box. This allows a user to reply to a question.
The problem I am having is if there is more than one question the functionality only works on the first button created.
PHP CODE
$C = count($array2);
for($i=0; $i < $C; $i++)
{
echo "<button id='reply'>Reply</button";
}
jQuery
$(function() {
var name = $( "#name" ),
allFields = $( [] ).add( name ),
$( "#form" ).dialog({
autoOpen: false,
height: 200,
width: 700,
modal: true,
buttons: {
Cancel: function() {
$( this ).dialog( "close" );
}
},
close: function() {
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
$( "#reply" ).click(function() {
$( "#form" ).dialog( "open" );
});
});
What I want is on the click on any of these buttons that the dialog box will open allowing the user to reply to a comment.
Thanks in advance.
Dave.
For Reply button, you should use Class instead of Id. Please try these code:
.....
for($i=0; $i < $C; $i++)
{
echo "<button class='reply'>Reply</button";
}
.....
$( ".reply" ).click(function() {
$( "#form" ).dialog( "open" );
});
Firstly, IDs are meant to be unique. Consider using reply as a class instead:
echo "<button class='reply'>Reply</button>";
Now your code should work with:
$(".reply").click(function() {
$( "#form" ).dialog( "open" );
});
Secondly, you might want to consider delegating to the parent to avoid adding unnecessary event handlers. For example, if all of these reply buttons were contained in an element #container, you could use:
$('#container').on("click",".reply",function(){
$( "#form" ).dialog( "open" );
});
I have a php page that needs a modal confirmation.
When clicking "Please confirm" on the dialog, I want the page post to continue. How in the world can I accomplish this?
Here is my js code so far:
$(document).ready(function() {
var $dialog = $('<div></div>')
.dialog({
autoOpen: false,
title: 'Are you sure?',
modal: true,
closeOnEscape: true,
buttons: {
"Please confirm": function() {
// want to continue the post that was interrupted
// by this dialog
$("#account_mgr").submit();
$( this ).dialog( "close" );
},
Cancel: function() {
$( this ).dialog( "close" );
window.location = "/account_mgr#MySubscription";
}
}
});
// $('#btnSubscription').click(function() {
$('#btnSubscription').live('click', function() {
$dialog.dialog('open');
return false;
});
});
Assuming the button otherwise posts a form, then just submit the form;
buttons: {
"Please confirm": function() {
$( this ).dialog( "close" );
$('#btnSubscription').parents('form').submit();
},
Cancel: function() {
$( this ).dialog( "close" );
window.location = "/account_mgr#MySubscription";
}
}
using jquery to post a value to php file but the value is not being posted (COMPANY_NAME). Code below works for multiple values but not when it's changed to post single values? Any tips?
$(function() {
$( "#dialog:ui-dialog" ).dialog( "destroy" );
var COMPANY_NAME = $( "#COMPANY_NAME" ),
allFields = $( [] ).add( COMPANY_NAME ),
tips = $( ".validateTips" );
$( "#dialog-form5" ).dialog({
autoOpen: false,
height: 200,
width: 350,
modal: true,
buttons: {
"ok": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
if ( bValid ) {
$.post("setCompany.php", {
COMPANY_NAME:$(this).val()
}, function(data) {
if(data=='no')
{ $("#msgbox").fadeTo(200,0.1,function()
{
$(this).html(data).addClass('messageboxerrorAdd').fadeTo(900,1);
});
} else if (data=='wrong') {
$("#msgbox").fadeTo(200,0.1,function()
{
$(this).html("fjdhffh").addClass('messageboxerrorAdd').fadeTo(900,1);
});
} else {
$("#msgbox").fadeTo(200,0.1,function()
{
$(this).html(data).addClass('messageboxerrorAdd').fadeTo(900,1);
});
}
});
$( this ).dialog( "close" );
}
},
Cancel: function() {
$( this ).dialog( "close" );
}
},
close: function() {
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
});
Try this :
$.post("setCompany.php",{"COMPANY_NAME":COMPANY_NAME.val()}, function(data)...
JSON objects require keys to be surrounded by double quotes
COMPANY_NAME:$(this).val()
I don't think that $(this) points to the company name field. Try this:
"COMPANY_NAME" : COMPANY_NAME.val()
(as mentioned before, JSON keys need to be in double quotes)