I'm working on a self-made e-shop CMS and in the backend and I need to be able to create relations between products. When adding a new product I want to be able to open a popup window in which I can select the related products and then, when I close the window, I need the selected items to be sent back to a field on my page (ie comma delimited string with the selected values). It doesnt HAVE to be a popup window, I'll be glad to use any other method as well, as long as it does the above.
Which ways can I do this? I know Ajax/jQuery will probably do the trick but I don't have much experience with them.
There are a lot of ways to achieve that. One of these in the following scenario:
First: You have a PHP script that connects to the database and get your data.
$query = "your query";
$results = mysql_query($query);
$yourdata = array();
while ($row = mysql_fetch_array($results,MYSQL_ASSOC))
{
/* format the data in JSON format*/
}
echo json_encode(array("yourdata" => $yourdata));
Second: Using jQuery or JavaScript to make an ajax call to the script and then read the returned data from the PHP script and output it in HTML elements.
Or you you can format the data in your PHP script and use JavaScript to parse it and display it.
I can't show you a complete example here for all that but if you search around you will find a lot of examples.
I also highly recommend, if you want to get started with all of this, Head First jQuery, a fantastic book that gets you started with jQuery.
There are great chapters such as chapters 8 and 9 where you will find how you can use jQuery and ajax to get the data and pass it back.
You will find the example code in this link. Download the sample code for chapter 8 and 9 and try it.
For the popup window part there are a lot of plugins and there are also jQuery UI try this: Modal form.
I hope that will be helpful.
Related
I want to display my data coming from sql db to front end. I want it to be displayed in some special manner.
Lets assume I have 8 element in total. I want to display only 3 data field at first in a row, and below that a message saying 'show remaining 5'.
Once someone click that another three should load and below a message would show 'show remaining 1'.
I am not asking for a ..read more type option. I want to display remaining data into segments, but not all at once. If anyone can guide me, what can I use or if there is any useful plugin, I am already grateful.
Thanks in advance for anyone who put some effort.
This sounds like something that would be done by JavaScript. This means building the whole table right away, but hiding all but the top 3 rows. Then hook a function to the "Show three more" button, that displays three more rows (until all is shown).
jQuery is a JavaScript library that is easy to get into and would help you get this kind of functionality going, but it is of course entirely possible to do without it.
If you are entirely new to web development with php, sql, html, and javascript I suggest looking at basic tutorials on how to accomplish the basics first, such as fetching data from a db, displaying that in html and how to modify the DOM with javascript.
You need to provide more information, but im gonna answer according to what i understood.
First you need to put the data in a table using <table><tbody><tr></tr></tbody></table>.
Then you can hide the other 5 data fields using css, you can use visibility: hidden or display:none.
Then you can display a message using bootstrap alert class thats says 5 other fields remaining.
I'm working with the jQuery Form plugin and was not able to find a solution for the following issue in their API:
With .ajaxForm i want to retrieve 3 or more fields out of a database. The content of each field should be written in 3 matching elements on index.php. I can get and write a single field by using
target: '#element1'
in my javascript file and by using
echo $content ;
in the matching php-script.
So how can i return more data in a single script? My thought was to return an array, but i have no idea how i target the different elements.
Well, once more, i figured it out.
So if there anytime someone will be who is trying to:
Fill a HTML Form with Database content without refreshing the Page
Here is how it can be done:
You'll need the following:
The html with the form you want to fill
The PHP script which gets your data from the database
The jQuery script which is handling both
I hope i did not miss something, got quite a headache after this. Feel free to ask.
I have asked this question in a similar manner here before and got a mixed response.
Having done some more homework I feel the need to ask again as I am taking a far more logical view toward it.
I have a search box, I want to take the the query from the search submission, process it and return the result to an Iframe in another page.
Very much like a php email form, but with a twist.
Ideal Scenerio:
search box query > process the query( the query is sent to external server in a string and processed, then returned as a html page > page displayed in an Iframe on another page.
I would like any suggestions or example code would be good.
Only some suggestions as I've not ready code to show you here:
this seems to me the ideal situation to use AJAX.
BUT I'd create and use a box (with div tag) rather than using an iframe.
You should bind your searchbox submission with a function that make the ajax call to a script that process the search parameters and provide you with results.
Once results are ready, your function callback will make them appear in your box (modifying the inner html contents of the box).
I think MAYBE you could get same result with an Iframe but, personally, I don't like using frames.
Hope to have helped you.
Here for you a little ajax tutorial showing just something like the thing you need
I could not find a good tutorial for how to generate tabs in html page. I would like to create a function that automatically generates a tab from database information.
I was thinking something along these lines.
Get categories from DB.
IF(!EMPTY(gategory))
{
create a new tab, named after the category.
}
Could somebody please link me to a good tutorial or maybe give an example.
Thank you.
Well, you know PHP is a server-side technology and there's no way for creating tabs in the client-side without JavaScript help!
In that case, check jQuery UI / Tabs:
http://jqueryui.com/demos/tabs/
You'll need to initialize your script by forming some JSON and iterating an array of tabs information so you should have enough for creating the whole markup that jQuery UI tabs needs in order to get initialized.
So I am trying to have a dynamic tabs kind of thing using both php and javascript. To make it much easier to understand, remember the two choices on facebook (Recent news and most recent) or something like that, when you click on one of them it just changes the content that you see in the middle without updating the page. i know how to delete the content in a div for example, but after deleting the content in the div (innerHTML = "") I want to populate it with the option chosen from the database.
So let's say I have an option (all) and an option (only this)
The default is all so when I run the page, I will just get all. However, if I click on only this, it will clear the div "my header" and will replace the content with the latest content from the database (database) and display it.
For that I need both php and javascript, is there a sample or an easy way to do this before i start digging around.
((Sorry if is not clear but the facebook example should be clear enough))
Whatyou are looking for a is AJAX/PHP approach.
Clicking on the tab
The current content gets removed. This is possible because it has a unique "id" attribute in the HTML code
The server is asked for the new content. This is the AJAX request that will be triggered after/while/... the content is removed.
The server sends back the code. This can be HTML, JSON, XML or similar.
You script recieves the answer, may "do" something with it (like some parsing or similar)
The content will be placed on the page (again, this is possible due to an unique "id"
This is basically the way it is done.
Check out the different JavaScript frameworks. They all come with nice AJAX support:
jQuery
MooTools
dojo
Prototype
And of course, SO is also a nice place to look at: https://stackoverflow.com/questions/tagged/ajax+php
What you're talking about is ajax.
I would suggest a javascript library to help leverage this, like jquery.
It can be as cool as
$.post('serverScript.php',
function(data) {
$('#idOfDivToUpdate').html(data); //shove script data into div
},'html' );
tutorial.