This is kind of hard to explain but i'll do my best to explain it and maybe someone knows what i'm trying to do.
I have a dashboard.php page and within that page i have a main-interface div that covers 100% width underneath a nav a header.
This dashboard when the user clicks a link changes the content of main-interface div with data from another page for instance search user.
I can load the search user page into the main interface fine but the problem I have is when I click search user it takes me back to the dashboard.php page with the original main-interface content rather than a table of all the users I searched.
I am having trouble telling the jquery that I want it to search for users and populate it back into the main interface page after the search user link was clicked.
Hope some one gets the idea of what im doing and trying to accomplish.
You could split tasks into client tasks and server tasks.
Client tasks are things that javascript/jQuery will do on the browser.
And server tasks are things that your server will do when requests get in.
This does not mean that the server will need to create full html pages, just send some information to the client bypassing a full page creation.
I often do something like:
<script>
var send = { };
send[ 'find' ] = $("input[name='find']").val();
send[ 'token' ] = $("input[name='token']").val();
$.post( 'request.php', send, function( data ) {
$("#name").html( data );
});
</script>
There are some options on the data you will get from the request.php.
You can let request.php create html that you can put into a <div id="name">.
Or write client side code that creates HTML from JSON.
Hope it makes sense.
Related
I am new to coding with php and SQL
I know html, css and js
I want to code for a simple chatroom web page
I have written the sign in and sign up part and I have saved some user accounts information in my database
but my problem is how to refresh only a part of web page using only php.
I have a div in my page for showing messages that are saved in database
and I want its content to be updated when a new message is gone to the database
but I don't want the whole page to be refreshed.
Please Help me wiith this.
To refresh only part of a webpage you can use AJAX. It is based on JavaScript and lets you update certain parts of a webpage without reloading it.
Here you can learn more: https://www.w3schools.com/js/js_ajax_intro.asp
PHP is a server language - and based in resquest/response, like everything in web.
It means that you can't send information to the client after the response.
So if you want to make your page dinamic, you have to send some javascript to the client browser.
Depending on what you want to reload, you will need json and jquery/ajax to get the information through GET or POST. The you change the content of the current page using this.
In this case, you can use another PHP page like 'getmessages.php':
function getMessage(){
$.ajax({
url: "getmessages.html",
context: document.body
}).done(function() {
$("#messagesdiv").html("-- body of message --");
});
}
while(true){
getMessage();
sleep(1000);
}
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
You can parse the json to get the information wich is better. And it verify the information every second.
There are many tutorials out there that can show how to do this.
You can find JQuery here.
I have a PHP-Script thats queries User-Status via SOAP.
I want to refresh the Page when the status for a user changes, for example when the user makes a call or hangs up.
How can I refresh the Page fast and smooth to always show the latest user status?
I read about Ajax and searched for a solution in HTML5. What is your advise?
Thanks for any helpful post :-)
My advice is to not load and interpret soap before page load.
Make two pages.
1 content page that displays everything you want, without the "latest status"
When the content page is loaded, make an ajax request to the 2nd page.(jQuery example)
$(document).ready(function(){
$.ajax("lateststatus.php").done(function(data){
// Change the name of the element to the element where you want to display the data
document.getElementById("mycontentdiv").innerHTML = data;
});
});
Then in the 2nd php file(lateststatus.php) load the soap file, interpret and generate only the html code you want to display in the content div.
That's it in a nutshell.
I thought it would be a great idea to let our associated dealers have the opportunity to have this on their own site as a widget. https://www.autopower.no/ ("Effektoversikt" to the right).
The "effektoversikt" fetches data from our MySQL database. Once the user finds their car and clicks "søk!" (search) they should be redirected to our page...
I'm thinking using iframe- or script-tags is the solution?
could someone point me in the right direction on where to start?
this could be a div element fed by a ajax request. The ajax request returns html snippet as search form, and when you submit, result is sent by website that generated the ajax request (so it looks like a redirect for the end user).
[edit]
Source website has an url that creates a HTML snippet as <form>...</form>. Say, not an HTML page, only the form.
target website uses, for example, JQuery to fetch the form via an Ajax request and set the html snippet into a div in target's website. As the form target is on the source website, a submit on the form automatically forward to that source site.
So create first a script/whatever that exposes the HTML snippet, then try to insert it into another page. You can experiment insertion part on JSFiddle.
I am tweaking a website to make it easier for employees to edit products. Right now, someone has to login to the DB and change prices, and then someone has to change the physical html of the website itself.
So I am writing code that pulls all the products off the DB, and displays them on a page which can be edited. I think doing everything with Ajax would be best.
ajaxRequest.open("GET", url, true);
ajaxRequest.send(null);
The problem is, I only know how to process Ajax requests using a URL (using POST, GET, etc). I need help writing the code to pull the info off the DB, and display it.
The table name is PRODUCTS. Within PRODUCTS are the columns ID, STOCK, SHORTNAME, DESCRIPTION, PRICE and SHIPPING.
In the HTML, I have a div setup:
<div class="product">
<div class="productName">
SHORTNAME, PRICE, SHIPPING
</div>
<div class="productDesc">
ID, DESCRIPTION, STOCK
</div>
</div>
I want to set it up so if I click a button, ajax pulls all the information off PRODUCT, and creates .productName div. If the user clicks .productName, it will then further expand to reveal .productDesc.
Question: How to I query the DB using AJAX on a button click, and put the information into elements?
Ajax cannot access your database. Ajax simply loads content from a URL. Your application must do this, and provide the result to an ajax call.
Here's how it will work.
Browser open a url on your server
PHP renders a page for display on the browser
User clicks something
Javascript sends an Ajax request to your server
PHP recieves this request and queries the database
PHP renders a response for the request
The Ajax handler on your page receives this response as plain text and does something interesting with it (such an inserting HTML, evaluating JSON, or executing javascript)
Ajax is just a way to load the response from a URL without actually navigating your browser to that page. It does not (and should not) have any sort of direct database access. In fact it has no idea there is a database at all.
Imagine the security issues if any javascript could read or write any field in your database. it would be a hackers dream.
You have to write a PHP script that queries the database and returns the results either as JSON or HTML.
This script is called via jQuery. E.g.
$('#main').load('http://your-url.com/yourscript.php');
This loads the output generated by yourscript.php (given that it is HTML) into an element with ID main.
You can find an Ajax tutorial with jQuery here. And a lot more tutorials on the jQuery tutorials site.
PHP - actually, it seems to be no job for jquery - once somebody edits it in DB, app gets latest information every hit.
Unless I misinterpreted your question, I see nothing this has to do with jQuery/AJAX.
I am attempting to make a registration-like page for a small forum. To register for an event, I simply want the users to click a 'link'. (It doesn't have to be a link, but I don't want it to look like a button, so fancy CSS is acceptable).
On this page there will be a limited number of openings per event. (Simple database query to populate this list). The users will then select one of the openings by clicking on it. At this point, I'd like that opening to close and the page NOT to reload (just the Div that link is in).
I know PHP/MySQL very well. Actually, DOING the insertion of the data is easy. What I don't know how to do is the clicking the link and not reloading the entire page but still showing that opening is now closed.
I've looked at jQuery. It seems to have the ability to do the autoreload. Can anyone help me out?
The insert in the DB will be the user's forum name (they are logged into the forum, I have access to that variable within my script). That is all that will get inserted into the database.
Look at the Ajax methods. To update the database you probably must do a $.post. Something like this will work:
$("#myButtonId").click(function() {
$.post(serverurl, $("myformId").serialize(), function() {
// This will be called when the post is complete
$("#mydivId").html('update html here');
});
});