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.
Related
I am trying to implement a feature in my webapp to let user click a button and see a "status report" of something. The status report is quite large hence I want to have it on a separate page. I am trying to think of a way to make an Ajax call to a PHP script and have the response data displayed nicely on another window. Is there a way to do that? I am new to web dev and any help would be appreciated. Thanks
Sumbit a form with target="_BLANK". That is don't make an AJAX call at all just a regular form sumbission triggered by javascript.
var form=document.createElement('form');
form.setAttribute('action',url);
form.setAttribute('target','_BLANK');
form.setAttribute('method','post');
form.setAttribute('style','display: none');
var inp=document.createElement('input');
inp.setAttribute('type','hidden');
inp.setAttribute('name',item);
inp.setAttribute('value',itemval);
form.appendChild(inp);
$('body').append(form);
form.submit();
This is not what ajax was made for.
When you open a new tab, server needs to send whole page anyway, there is no way to share HTML page between two tabs.
You can send report on page load or if sending asynchronously is necessary then try passing some GET variable which triggers ajax call from new tab.
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.
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'm calling a view after an AJAX POST action. But I'm loading the view and calling Database data out of sync with the data being written. When I load the page, I look into the database and see the data there but it's not being rendered on the page. (I tried sessions and got the same problem). In order for the view to actually render the data from the database, I need to actually refresh the page. Same thing with the sessions, I need to refresh the page in order for the sessions data to render. Is there a common reference to this kind of issue? I read about POSTBACK, is this something I need to look into further? It's basically a strange sync issue where the data is not being generated until I refresh the page and re-load it.
jQuery ajax call are async, by default. The javascript code continue without waiting for the return from the server.
So let look at :
$.post('source.php',function(valueFromPHP){
alert(valueFromPHP)
});
alert('Hello world')
In the previous example Hello Wold is alerted first, then the value from php.
If you want to insert the return value from php into your page you need to place all your code into the sucess function :
$.post('source.php',function(valueFromPHP){
alert(valueFromPHP)
alert('Hello world')
});
In the second example the value return from PHP is alerted first, then Hello world
So if you want to render the data received from php make sure you place your code inside the success function. Normally that is where we get error while working with jQuery ajax.
Let me know if it help!
can any one please help how to get the values from the javascript to php other than while using submit button.
scenario:
i am searching for record, if the record found then, i need confrim alert asking to continue or not, if he click continue how can i say he selected continue
If you want to check without having a page reload, you probably want to execute an AJAX call, then depending on the result returned by the underlying PHP script, take the appropriate action. If you have no knowldege of how to implement this, take a look here
You can never use JavaScript to communicate with the page while it is loading, you can only send a new request to the web server from the JavaScript layer... although you can send that request to the same script that's already running, it will still be a new instance of the PHP script, just like when you open a new browser tab to the same page.
The only way for JavaScript to communicate with PHP at all, is by sending an HTTP request. But you don't have to refresh the page in order to do that if you use AJAX.
AJAX is basically a word to describe JavaScript exchanging information with web pages without refreshing the page. But note that it will still not be able to change variables in the PHP script which is running when the JavaScript code is executed.
In the case of PHP, I've used the open-source library SAJAX which is quite simple. You will find it at http://www.modernmethod.com/sajax/
Hope it helps and good luck!
You can use this as an example using jquery and PHP:
$.post('searchimage.php', { action: 'searchimage', imgreference: $(this).val() },
function(data) {imgsample.html(data);}
);
Basically apply the above function in a document ready function so its run when the page loads.
This can be triggered using $("#prodcode").click() or what ever event handler you want to use.
The php page in my example will get sent the value from imgreference as a post, you can do whatever you want in the php page then return the value which gets added to the imgsample (in this case a td)
hope this helps.