I am using below script on a form (say, form-A) to load another form (form-B) in thickbox, with values passed by controller.
First, in form-A, i am selecting one option from dropdown "customerID", then "Add Project" button (with id 'addProject') becomes visible, on clicking which, a thickbox appears with form-B in it. Here, in form-B, i want to pass selected customer. How can I do that?
I tried below code, and tried to access the $_GET['custID'] in controller's manage_project function, but it is showing blank. But when i am alerting the url1 (i have commented below), ID is coming there.
Below code is in form-A view file.
('#addProject').click(function(){
var url1='<?php echo SITEURL ?>/xome/invoice/manage_project?TB_iframe=true&height=800&width=700&inlineId=innerDiv&class=thickbox&custID='+$('#customerID').val();
//alert(url1);
tb_show('Add More Project',url1,'');
})
According to documentation at (http://thickbox.net/):
Important to Remember: Add all other query parameters before the
TB_iframe parameters. Everything after the "TB" is removed from the
URL.
So, try add custID before TB_iframe. And then you will be able to operate with a variable in the script, such as access them via $_GET['custID']. For example:
var url1='<?php echo SITEURL ?>/xome/invoice/manage_project?custID='+$('#customerID').val() + '&TB_iframe=true&height=800&width=700&inlineId=innerDiv&class=thickbox';
Related
ORIGINAL POST: Not sure why I am having such a hard time grasping this but I am creating a page that executes a query to list a set of records per a user. I am wanting to create a div that shows the details of a select record from the list. I am attempting to load that record with the following:
$(document).ready(function(){
// load index page when the page loads
$("#form").load("tm-reserves-form.php");
$("#record").click(function(){
// load home page on click
$("#form").load("tm-reserves-form-test.php?ContactID"+$ContactID);
});
});
Initial form loads but I can not get my .click function to work using the URL parameters.
How can I pass the url parameter from my current query into a div that loads an external page and executes a second query based on that url paramenter (primary id)?
Thanks in advanced for helping me out!
EDIT POST: Found solution, but another issue has arisen.
So I took a crash course this weekend on ajax and I found a working solution here:
$(document).ready(function(){
// load index page when the page loads
$("#form").load("tm-reserves-form.php");
$("#record").click(function(){
// load home page on click
var ContactID = document.getElementById('ContactID').value;
$("#form").load("tm-reserves-form.php", {"ContactID": ContactID});
});
});
So with this example, when the page loads the div form is loaded with a default page. With a click function on the label #record the div #form is than loaded with a parameter of ContactID that is a string value inside of #ContactID. All that seems to work very well (even passes the parameter correctly).
The issue now is that it is only allowing me to pass the first record to my div. Any thoughts on what I need to implement next? I originally thought it was to clear the var but that didn't work either.
The original query parameters are not readily available to a running script. So $ContactID is not resolved to an actual value.
See this page on methods for extracting query parameters from the current page:
Get query string parameters with jQuery
$(document).ready(function(){
// load index page when the page loads
$("#form").load("tm-reserves-form.php");
$("#record").click(function(){
// load home page on click
var ContactID = document.getElementById('ContactID').value;
$("#form").load("tm-reserves-form.php", {"ContactID": ContactID});
});
});
This code solved my initial question, but led to an additional question.
so, I have read just about every question on this subject, but the solutions don't work for my project, it seems that when I change the dropdown, it does the first event, but when I change to a different element it doesn't do anything else, but when I do this with an alert message it changes every time.
here is what I have to demonstrate what I mean
I tried .post it works great until I add php and all the dynamic functions, is it because I used $('#updateDiv').html(url);
I also hide and showed the div based on the change of the dropdown, but all that did was hid and show the div, I want the div to show the content based on a list of categories.
the PHP side will be dynamic, but if I do .html() none of the php renders properly.
http://fiddle.jshell.net/LrxUS/
$.post(url, function(data) {
$("#updateDiv").html(data);
});
As per the fiddle, you have specified
var mydropdown = $('#mydropdown');
but in the change function, you have specified $(mydropdown), either define only id in the variable or the object. Like,
var mydropdown = '#mydropdown';
$(mydropdown).change(function() {}
After that use $.ajax to get the dynamic content.
Ok, lets make it the simplest so that there is no room for mistake in the client side script. Use $.load method defined here.
AS:
$("#updateDiv").load(url);
And don't forget to check what your firebug, chrome inspector or fiddler says about your request in case if you don't get the required result.
i would like to use ajax to retrieve information from a php page that will update "onchange" of a select drop down menu. (<select>). i used jquery to check if it is changed
$('#names').change(function() {
//code to get the info into the div comes here
})
all id like to do is work the page "check.php" with "?v=valueOfNamesGoesHere"
and return the information into the div names "output"
I have tried
$('#names').change(function() {
$('#output').load('check.php?v=' + $('#names').val());
});
without success. I have checked the "check.php" itself with the information that is supposed to get passed into it. for example "check.php?v=john" and i got the information needed in the page itself. (when i go directly to mysite.com/check.php?v=john).
what am i doing wrong?
Thanks!
use
$('#names').find(":selected").text()
instead of $('#names').val() as it is a dropdown..
I have a page I am constructing and I need to pass in the values of the option dropdowns to the next page. The problem is that these dropdowns are not in a form.
http://posnation.com/test/pre_config/pre_config_step_2.html
Basically what i need to pass to the next page is that when i click "Proceed To Next Step" I need to pass the value of the type of field like "restaurant" and the number of stations "2" if the user selects restaurant and 2.
HTML:
<a id="proceed" href="foo.html">Proceed!</a>
JS:
$('#proceed').click(function() {
location.href = this.href +'?someVal='+ escape($('#my_select').val());
return false;
});
Working example that executes a formless google search: http://jsfiddle.net/CKcbU/
You basically just add what you want to the query string with javascript.
But really, if at all possible, you should use a form with method="get" which pretty much does this for you without any JavaScript at all.
Use a query string.
http://posnation.com/test/pre_config/pre_config_step_2.html?restaurant=The+Eatery&stations=2
In other words, pass them as part of the URL when calling the next page. The next page will be responsible for reading the query string and extracting the values out.
http://en.wikipedia.org/wiki/Query_string
I do not know what you are using to code in so I cannot be detailed regarding the mechanics of constructing the URL or parsing out the values from the query string on the receiving page.
Here is an article on doing it using JavaScript:
http://javascript.about.com/library/blqs.htm
You can use JavaScript for the same. Assign a onclick event with button of proceed and call a function. In this function use:
windows.location=url?rest=valuerest&opt=valueopt
I am not sure what you are working with, but with almost any framework that I know of you can pass a parameter as part of the url.
These would work fine.
http://posnation.com/test/pre_config/step_2
http://posnation.com/test/pre_config/step_3
Then, just grab the parameter and react accordingly.
Im looking for a way to have a form in cakephp that the user can add and remove form fields before submitting, After having a look around and asking on the cake IRC the answer seems to be to use Jquery but after hours of looking around i cannot work out how to do it.
The one example i have of this in cake i found at - http://www.mail-archive.com/cake-php#googlegroups.com/msg61061.html but after my best efforts i cannot get this code to work correctly ( i think its calling controllers / models that the doesn't list in the example)
I also found a straight jquery example (http://mohdshaiful.wordpress.com/2007/05/31/form-elements-generation-using-jquery/) which does what i would like my form to do but i cannot work out how to use the cakephp form helper with it to get it working correctly and to get the naming correct. (obviously the $form helper is php so i cant generate anything with that after the browser has loaded).
I an new to cake and have never used jQuery and i am absolutely stumped with how to do this so if anyone has a cakephp example they have working or can point me in the right direction of what i need to complete this it would be very much appreciated.
Thanks in advance
I would take the straight jquery route, personally. I suppose you could have PHP generate the code for jquery to insert (that way you could use the form helper), but it adds complexity without gaining anything.
Since the form helper just generates html, take a look at the html you want generated. Suppose you want something to "add another field", that when clicked, will add another field in the html. Your html to be added will be something like:
<input type="text" name="data[User][field][0]" />
Now, to use jquery to insert it, I'd do something like binding the function add_field to the click event on the link.
$(document).ready( function() {
$("#link_id").click( 'add_field' );
var field_count = 1;
} );
function add_field()
{
var f = $("#div_addfield");
f.append( '<input type="text" name="data[User][field][' + field_count + ']" />' );
field_count++;
}
Of course, if a user leaves this page w/o submitting and returns, they lose their progress, but I think this is about the basics of what you're trying to accomplish.
This was my approach to remove elements:
In the view, I had this:
echo $form->input('extrapicture1uploaddeleted', array('value' => 0));
The logic I followed was that value 0 meant, not deleted yet, and value 1 meant deleted, following a boolean logic.
That was a regular input element but with CSS I used the 'display: none' property because I did not want users to see that in the form. Then what I did was that then users clicked the "Delete" button to remove an input element to upload a picture, there was a confirmation message, and when confirming, the value of the input element hidden with CSS would change from 0 to 1:
$("#deleteextrapicture1").click(
function() {
if (confirm('Do you want to delete this picture?')) {
$('#extrapicture1upload').hide();
// This is for an input element that contains a boolean value where 0 means not deleted, and 1 means deleted.
$('#DealExtrapicture1uploaddeleted').attr('value', '1');
}
// This is used so that the link does not attempt to take users to another URL when clicked.
return false;
}
);
In the controller, the condition $this->data['Deal']['extrapicture1uploaddeleted']!='1' means that extra picture 1 has not been deleted (deleting the upload button with JavaScript). $this->data['Deal']['extrapicture1uploaddeleted']=='1' means that the picture was deleted.
I tried to use an input hidden element and change its value with JavaScript the way I explained above, but I was getting a blackhole error from CakePHP Security. Apparently it was not allowing me to change the value of input elements with JavaScript and then submit the form. But when I used regular input elements (not hidden), I could change their values with JavaScript and submit the form without problems. My approach was to use regular input elements and hide them with CSS, since using input hidden elements was throwing the blackhole error when changing their values with JavaScript and then submitting the form.
Hopefully the way I did it could give some light as a possible approach to remove form fields in CakePHP using JavaScript.