i have a php script who parser a rss and give me the data in a know pattern. Im very new with ASP, JavaScript and Jquery so i dont have any idea of how to autoupdate the script and display the new data with a smooth animation (see this example, that exactly what i want). Thanks for the support and if you know a good script to made this i will appreciate it.
Seems like you're looking for this:
http://leftlogic.com/lounge/articles/jquery_spy2/
It's PHP (not ASP), so that might be an issue, though the code is SUPER easy to implement (I've written by own implementation on three separate occasions).
The site itself has some decent documentation on getting things up and running, but if you need some extra help, comment and I'll point you in the right direction :)
Good luck!
The resources people have linked here are helpful and merely mentioning jQuery means you're probably headed in the right direction. But if you're new to this it might still be worth mentioning some of the concepts you'll be looking to play with here.
First of all, you'll probably want to stick with one language on the client side and one on the server side. This means choosing either PHP or ASP -- this isn't clear from your question but I'll assume you're dealing with PHP since that's the language I use for this kind of thing. JavaScript + jQuery is the right choice for the browser (client) side of things.
Like Luca points out, you'll have to set up some JavaScript code that goes live on page load and "polls" the server at a set interval. In JavaScript you do this using something called XMLHttpRequest (or "XHR") and it's pretty complicated. You could use combination of jQuery and a library like the one Matt points to in his answer, or just jQuery -- sample code abounds but it's basically a loop with a function call and sleep timer.
That function call is going to be one of the more difficult parts if you're trying to emulate the Twitter World Cup site. But here's the basic idea: You need to populate a list using jQuery and a data standard like JSON. Since the RSS feed you'll be parsing is written in XML, you'll have to write a server side (PHP/ASP) script that fetches, parses and converts the feed to JSON. In PHP, this is best done through cURL (file_get_contents() if you're lazy), SimpleXML and json_encode(), respectively.
Your JavaScript should load the list based on JSON. To do this, and display any new items, what you'll do is load the JSON from the client (browser) side using a jQuery method like getJSON(). Then you spin through the array object and add any new items to the list by adding new <li> elements to the "DOM." The same jQuery code that does this can easily also do the cross dissolve with something like fadeIn().
It looks like the script on that example page has an Ajax request running every TOT seconds.
You could simply have your PHP script return the RSS data (in JSON format say) and let JavaScript parse it and generate some HTML with it.
If all of this doesn't make sense to you I advice reading a little about JavaScript and PHP... there's plenty of good books.
Related
I recently created an image that automatically changes depending on the time thanks to a PHP script. I'm now thinking about doing something but I'm not sure if it's possible.
I do have restrictions. I need this to work on a forum board so it means I have to have all scripting on a different server. I would Google how to do this but I'm not sure what to search hence the broad title. If someone could possibly tell me if it's possible and show a small example to get me on the right track, that'd be appreciated.
What I need to do is print text out onto the page. As I stated above, all the scripting needs to be on a different server as the forum doesn't allow for php and only basic HTML (similar to here). This means I can't use include 'file.php';.
IMHO You have two options
Use HTML iframe element to embeed the external content (just give the external URL and the browser will handle the rest)
Call ajax request from javascript and inject the result into the DOM tree of the board.
Now that Your decision what suits You more.
I'm working on a editing tool (type of a simple CMS) in PHP/MySQL for a product catalog. I have search the Internet for a solution but I don't even know what to search for. So now my hope is on you guys.
I have a form where you can put all kinds of data like part.no, description an so on. All of this data is saved into a MySql table (items). I also have a table with predefined specifications.
What I want to do, and that I can't find a solution for, is to have a dropdown meny (or similar) and a add button to add a row for each related specifications without saving the whole form each time. I want to save first when all specifications is selected.
So, can I use PHP for this or do I need jQuery/Javascript or similar? I know it's possible, have seen it in OpenCart :-)
I hope someone understands my question. It's hard to explane i a language I'm not fully manage.
Regards
Client-side vs Server-side
Javascript: This sits in the user's browser. So anything you want to move in the user's browser will be done with JavaScript. This is "client-side"
PHP: This site on the server, so takes inpute from the user's browser and gives back a response (generally HTML, but can also be JSON or XML which is read by Javascript.). This is "server-side".
Libraries
jQuery: This is a set of functions written for Javascript to make it easier. So it runs in the user's browser and makes it easier for you to write bits that move on the screen.
You get similar libraries that help you write PHP (commonly called "frameworks") and there are many others for javascript as well.
Where to start
Write your HTML page as you want it to look. Keep it simple for the first time.
Then write some javascript (possibly using jQuery) to move the menu. Google "jquery menu dropdown" or similar and you'll find a solution you cna customise.
Then write some PHP that gives you the HTML you wrote in '1'.
Then decide what's going to happen when you click on a link in the HTML, and repeat the process (write HTML, incorporate Javascript to make it move, write PHP to give HTML)
Then work out which bits of the HTML are common or structured and should come from a database.
Without writing it for you (in which case you'll never learn) best to start one bit at a time and build as your knowledge grows. Bucket loads of examples on the web when youreach a particular problem you need to solve.
After comment "[how to] make it possible to select and add single/multiple specifications (from another table) without saving the whole form each time a specs is added":
Growing with AJAX
What you are asking is AJAX - this is where you get Javascript to talk to the server, and for javascript to move bits on the page based on the results. jQuery is probably the easiest (and probably has best documentation / examples for the ajax, as well as moving the DOM).
Basically: you have an "event" that you trap in JavaScript, example
/// Using jQuery to trap a button click
$().ready( function() {
$("#ButtonID").click( function(e) {
e.preventDefault();
alert('Button Clicked');
});
});
Then you build in an AJAX call inside that event (also check out get or post as the syntax is easier, you just get less control). The AJAX wil send a request to your PHP server, and you can get PHP to return HTML which you can replace/insert using the DOM manipulation functions linked below (e.g. before, html etc) or, when you get more advanced, you'll send back JSON which is a data structure you cna more easily manipulate in JavaScript to stipulate what actions are required.
As above, without actually writing it for you, the best place to start is to read the docs and have a go. Google "jquery AJAX PHP table example" or similar and you'll find an example somewhere.
This may be a inappropriate question for SO, but I thought lets see :)
I'm writing a website in php. Every pageload may have 10-20 DB requests.
Using the result of the DB queries I need to generate a page.
The page would contain a topic (should be image or text) followed by comments. There could be mutiple topics like this.
Currently, I'm creating a string using the DB result and sending it to the browser.
When browser receives the string (as an ajax response), it parses using split functions and creates the HTML dynamically.
I'm basically a C++ programmer; relatively new to web development. So, I do not have fair understanding of the JS objects. How long of a string can JS variable hold? Is it ok to use split and generate HTML at the client.
I'm not generating the complete HTML at the server side to avoid any overhead because of string concatenation. I believe sending less no. of characters to the client (like I'm doing) is better as compared to sending complete HTML code.
Is something (or everything) wrong in my understanding :)
Any help is appreciated.
EDIT:
Well, I'll be highly grateful if I could get opinions in yes/no. What would you recommend. Sending HTML to the client or a string that will be used at the client to generate HTML?
Unless you have a specific reason for doing so, I think you should look into generating the HTML with PHP and sending it directly to the browser. PHP was built specifically for this purpose.
I think you be best off to look at jQuery and more specific to the AJAX method of that library. Also, take a look at JSON and you should be all good to go.
Have you considered using a templating engine like Smarty?
It's pretty simple to use, take a look at the crash course, you might like it! http://www.smarty.net/crash_course
I've been asked to create a web UI that allows a user to modify a specific section of the HTML DOM and then POST the modifications back to the server for storage. The modification should be done via drag'n'drop, with my tool of choice being jQuery. The server will be PHP, but written by someone else since I'm not a PHP programmer.
The only way I can think to do this is to send back to the server the entire DOM section via AJAX whenever it is modified. However, that is expensive since the section could be quite large. Furthermore I'm not sure how I'd efficiently capture the modified section and write it to a string which can be sent to the server. Overlapping events would also be a big concern.
Any ideas for a better approach? Are there libraries/tools (JavaScript or server-side) that I should be considering? Many thanks.
Well if you are dealing with some list of elements, say rows in table you can send back a map where particular row is mapped to a position then when you re-initialize the page you can feed such map back and rearrange the list.
Also - another idea (since you are using PHP) you can have some sort of a model on the back end which backs your visual DOM element, then again - you send back some parameters you have changed (order, size, etc.) and adjust/save the model
Instead of sending the entire DOM section you should try to serialize the DOM section you're sending to something more lightweight (like JSON). Since it's HTML, serializing it to JSON will dramatically reduce it's size.
Apart from that I think there's not much you can do besides some AJAX request to allow the server to save the changes.
You'd want to use something like the UI plugin to facilitate the actual dragging/dropping/reorganizing. I don't know of any libraries that will pick out DOM objects and AJAX information to a server in a particular fashion, so you would probably have to code something like that yourself to suit your specific needs. It might help to know what sort of DOM node you're trying to send.
If you're building something like a custom WYSIWYG, sending the entire node might be the best approach without losing information. If you're doing something simple like allowing users to drag and drop to reorder a list something like the following code might suffice:
var toPost = '';
function handler(data) {//handle server response}
$("ul#container li").each(function(){toPost+=this.getAttribute('rel');});
$.post('processing_script.php',{data:toPost},handler);
I checked into how Google handles these. If you drag and drop an element on the iGoogle homepage, a GET request is sent to the Google handling script with the following parameters:
et '4af26272PQUMZP8V'
mp '19_1:4_1:7_1:13_1:16_1:18_2:2_2:3_2:14_2:11_2:_opt_3:17_3:6_3:12_3'
Have any bridge libraries been developed for PHP that provide access to the jQuery framework? Ideally it would be nice to have something fairly extensible so that creating jQuery-based content using PHP code would be fairly easy and customizeable. Does such a thing exist yet?
pquery
jqpie
jquery-php
There's a warmup list.
So far I've found one that seems to fit the description. I haven't tried it out yet, so if anyone has any feedback or experience with this or other ones don't hesitate to post!
PQuery
jQPie might be what you're after.
What can jQPie do?
Easily request and process data from php using $.getJSON
Inject php generated html into elements using $.(element).load
Call php functions directly from your web pages using $.jqpie
Call jQuery from php in respond to $.jqpie calls
Advanced autocomplete using jqpie_complete
QueryPath (http://querypath.org) is a full implementation of the jQuery DOM/XML/HTML part of jQuery. QueryPath has full CSS 3 selector support (including the stuff jQuery doesn't have, like XML namespace support). It also comes with DB tools, where you can run queries and have the results inserted into the query object. And it has a template engine, too. Like jQuery, you can write custom extensions very easily.
But it definitely takes advantage of its server-side status.
The main project page is at https://fedorahosted.org/querypath. You can download it there (and see lots of examples, including RSS and SVG manipulation).
Integrating with jQuery, then, can be done easily by sending XML data of many sorts down to jQuery. (You could probably send JSON, too... never tried.) And since the server side code and the client side code both look the same, there's less of a need to learn two totally different toolkits.