I have a page called getvalues.php, I need to call a function which is written in a different php page(fileclass.php) in a class from this page(getvalues.php), but the issue is i need to pass a variable also which is $i, and the value of $i passed should be 1 if we are selecting option B, and $i=2 if option=c, and $i=3 if option=D given in dropdown. I had simply wiritten an onchange event but had not written any code in javascript. Please help Thanks. Here is the code for getvalues.php
<html>
<select id="s" onchange="callsome();">
<option value='B' selected>B</option>
<option value='c'>c</option>
<option value='D'>D</option>
</select></html>
<?php include("fileclass.php")
$obj=new file;
echo $obj->func($i);?>
You could implement this using JQuery or Javascript (I use JQuery in the example because it is shorter and easier to make Ajax calls) :
<html>
<select id="s" onchange="callsome();">
<option value='1' selected="selected">B<option>
<option value='2'>C</option>
<option value='3'>D</option>
</select>
<script>
function callsome() {
var selected = $('select#s option:selected').val();
$.ajax({
type: "POST",
url: "fileclass.php",
data: ({selectedvalue : selected}),
success: function(data) {
alert(data);
}
});
}
</script>
</html>
After that the callsome returns the output of the fileclass.php script and you can use that however you like in your code. From your explanation it was not really clear what is happening in fileclass.php and what you want to do with it, so I hope it helps you.
If you want the function in Javascript only:
<script type="text/javascript">
function callsome() {
var e = document.getElementById("s");
var strVal = e.options[e.selectedIndex].value;
var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
var data = xmlhttp.responseText;
//use the data as you wish
}
}
xmlhttp.open("GET","fileclass.php?selectedvalue=strVal",true);
xmlhttp.send();
}
</script>
This isn't the way PHP and HTML work.
PHP is rendered on the server. HTML is rendered on the client, after the PHP is completely done. To do what you want to do, you need to have the HTML (possibly Javascript) make a request to the PHP page at fileclass.php.
Related
I have a problem with AJAX and JQUERY.
I have a form, which contents a tag. After select an option, I use AJAX to generate a formular, fill it with some data from a database and show it.
I would like to use the jQuery UI MultiSelect Widget
The problem is that I need to initialize the select with jQuery but it doesn't work when I call this function in the file that generates the new content: (it works well if I don't use AJAX).
<script type="text/javascript">
$(function(){
$("#ExampleSelect").multiselect({
selectedList: 4
});
});
</script>
The structure is the following:
PHP file with the main form which contains a normal and a which will contain the elements that are generated after the AJAX call. (onChange event in the <select>).
Ajax file
function LoadDiv()
{
var xmlhttp;
var serie_id = document.getElementById('serie_id').value;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("divForm").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","divDataManagement.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("serie_id="+serie_id);
}
$.ajax({
success: function(){
$("#ExampleSelect").multiselect("destroy").multiselect({
selectedList: 4
});
}
});
PHP file that contains the jQuery UI MultiSelect which wil be displayed in the main php form (inside the <div> tag).
<select id = "ExampleSelect" multiple>
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
</select>
Thanks for your help.
Initialize it in AJAX success method.
$.ajax({
...
success: function(){
$("#ExampleSelect").multiselect({
selectedList: 4
});
}
...
If you make changes on a selected instance of multiselect, destroy it and reinitialize after changing.
$.ajax({
...
success: function(){
$("#ExampleSelect").multiselect("destroy").multiselect({
selectedList: 4
});
}
...
In case you use XMLHttpRequest instead of jQuery ajax, you should init multiselect in onreadystatechange method.
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("divForm").innerHTML=xmlhttp.responseText;
$("#ExampleSelect").multiselect({
selectedList: 4
});
}
}
I'm trying to pass multiple parameters via the POST method using AJAX to my PHP file so that I can make a query to a MySQL database.
HTML file :
<div class="dropdown dropdown-dark">
<select class="dropdown-select" id="searchselect11" required>
<option value="faculty">Faculty</option>
<option value="dept">Dept.</option>
<option value="course">Course</option>
<option value="year">Year</option>
<option value="name">Name</option>
</select>
</div>
<td style="padding:5px;"> <input type="text" id="searchtext11" required></td>
<button id="searchgo1" onclick="searchone()"></button>
This is the Javascript file where I successfully access dropdown value and textbox value and store them in sv and searchtext11 variables respectively. But the problem is to pass the two values to the PHP file. The problem seems to be in the_data variable that is passed in xmlhttp.send(the_data);
The searchone() function is as follows:
function searchone()
{
//alert("hi");
var xmlhttp;
var sel = document.getElementById('searchselect11');
var sv = sel.options[sel.selectedIndex].value;
var searchtext11= document.getElementById("searchtext11").value;
var the_data = 'select='+sv+'text='+searchtext11;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("POST", "searchone.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send(the_data);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4) {
document.getElementById("searchresults").innerHTML = xmlhttp.responseText;
}
}
}
This PHP code works only if
var the_data='select='+sv;
searchone.php
<?php
if (isset($_POST['select'])) {
$str = $_POST['select']; // get data
echo $str;
}
?>
How do i get both dropdown and textbox value to my PHP file so that i can form sql query using those variables.
You need to use an ampersand, just as if it was a GET. Further, you should encode your text to make sure that it doesn't contain any characters that could have a special meaning
var the_data = ''
+ 'select=' + window.encodeURIComponent(sv)
+ '&text=' + window.encodeURIComponent(searchtext11);
// ^ ^^
You don't need to decode manually server-side because you are already letting it know that POST data is x-www-form-urlencoded.
add & in this string:
var the_data = 'select='+sv+'&text='+searchtext11;
I have a script which uses AJAX to connect to a PHP script which queries a database and returns some values. The code of which is below:
<script>
function showUser(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajaxphp.php?ID="+str,true);
xmlhttp.send();
}
</script>
<select id="users" name="users" onchange="showUser(this.value)">
<option value="">Select a person:</option>
<!-- PHP populates this dropdown box -->
</select>
<div id="txtHint"><b>Selected user info will be listed here.</b></div>
Right now the txtHint div will return anything the ajaxphp.php script prints. This isn't very flexible, however. What I want to do is create an array in ajaxphp.php and use json_encode() to pass the results back.
The problem I'm having is I don't know how to get the original script to grab the results so I can do useful things with them. Right now I can make it return a JSON array which will appear in the txtHint div but I've no idea how to get PHP to actually read that information so I can do something with it.
Try using jQuery Ajax...
$.ajax({
url : 'ajaxphp.php?ID='+str,
type: 'get',
dataType:'json',
success : function(data) {
console.log(data);
}
});
Data in success function parameter is your encoded result that you return from php.
echo json_encode($result);
Then you can access it with something like this from javascript.
data.result1
data.result2
data.result3....
Use $_GET method to See what ever the user send you in php see here:
http://php.net/manual/en/reserved.variables.request.php
Maybe the json_decode() php method is the solution of what you want.
http://www.php.net/manual/en/function.json-decode.php
This method takes a JSON encoded string (from the json_encode method for example) and converts it into a PHP variable... so you can use this variable like an object and simply access to its attributes.
Maybe this other post will help you : How to decode a JSON String with several objects in PHP?
Hope this helps ! Bye !
I have a simple form that that when changed includes a php file in a div. For some reason jquery will not load when placed in that included file? Can someone tell me why this doesnt work.
<select name='make' onChange='show(this.value)'>
<option value='some-file.php'>the file</option>
</select>
<div id="make">Where the file is loaded and where jquery wont work</div>
<script type="text/javascript">
function show(str)
{
if (str=="")
{
document.getElementById("make").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("make").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","include/some-file.php?q="+str,true);
xmlhttp.send();
}
</script>
Then some-file.php
$models = mysql_query("SELECT model, id FROM model where make like '%".$q."%' order by model asc") or die(mysql_error());
//Puts it into an array
$count = 1;
$max = 3;
while($model = mysql_fetch_array( $models ))
{
if($count%20==1)
echo '</ul><ul style="float:left; padding:0; margin-right:10px;" class="makesModels">';
echo "<li style='padding-right:5px; display:block;'><font color='#fe9000'>".$count.".</font> ".$model['model']." <a class='delete-model".$model['id']."'>x</a></li>";
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.1.min.js'></script>
<script type='text/javascript'>
$(docuument).ready(function() {
$(".delete-model<? echo $model['id'];?>").click(function() {
alert("delete");
});
});
</script>
$count++;
}
?>
i've had the same exact problem ...
to solve this all you need to do is edit the ajax from using normal JavaScript to $.ajax so use jQuery to handle it .. and it will work ..
$.ajax({
url: "include/some-file.php?q="+str,
type: "GET",
datatype: 'html',
success: function(e){
$('#make').html(e);
}
});
I'm not sure about it, because the code is not complete, my guess would be that on someotherphpfile that you are importing you use document.ready function which is not calling because you load the file using ajax.
scripts loaded with ajax or in general a script string injected in the DOM will not execute for security reasons
you can use eval to get it working although i must warn you that you could be opening a can of worms..
after document.getElementById("make").innerHTML=xmlhttp.responseText; add this..
var parent = document.getElementById('make');
var myScript = parent.getElementsByTagName('script');
for(var i=0,len=myScript.length; i<len; i++){
executeScrpt(myScript[i]);
}
then the execute function...
function executeScrpt(scrpt){
if(scrpt.innerHTML != ""){
eval("("+script.innerHTML+")");
} else {
if(scrpt.src != ""){
var myScrpt = document.createElement("script");
myScrpt.src = scrpt.src;
document.head.appendChild(myScrpt);
}
}
}
The HTML with the select value is:
<select id="value_select" onchange="get_value_js()">
<option>Value 1</option>
<option>Value 2</option
</select>
The JavaScript code:
function get_value_js() {
var the_value = document.getElementById("value_select").value;
}
I don't know how to continue the JavaScript to send the value to, for example, work.php. In work.php, I want to store the value in a PHP variable.
You can use AJAX.
function get_value_js(){
var xmlhttp;
var e = document.getElementById("value_select");
var the_value = e.options[e.selectedIndex].value;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//Do whatever with xmlhttp.responseText;
}
}
xmlhttp.open("GET","work.php?val="+the_value,true);
xmlhttp.send();
}
You can use $_GET['the_value'] to grab the value.
You need to enclose the <select> in a <form> tag like so:
<form id="myForm" method="post" action="work.php">
<select name="value_select">
<option value="1">Value 1 text</option>
<option value="2">Value 2 text</option
</select>
</form>
Please note that i've added value attributes to the <option> tags & added a name attribute to the <select>.
Next, you can submit the form in the following way:
function send()
{
document.getElementById( "myForm" ).submit();
}
Next in work.php:
<?
$value_select = $_POST[ "value_select" ];
echo( $value_select );
?>
You could either send it as an AJAX call if you want to stay on the same page or perform a redirect and pass the value as query string parameter:
window.location.href = '/work.php?value=' + encodeURIComponent(the_value);
Use ajax with jQuery
function get_value_js() {
var the_value =$("#value_select option:selected").val();
$.post('work.php?val='+the_value , function(data) {
//do whatever you want with the result
});
}