Welcome Guest, Not a member yet? Register   Sign In
Show table based on dropdown change without page refresh in php
#1

[eluser]rash[/eluser]
Hi All,

There is a problem that i am new in php mvc format and i want to show a table when dropdown value change, without page refresh and again it submit a form data.

My porblem is i don't know that where i put my ajax code and what i write in controller, model and view...
I tried something but it shows noothing.

This is my view page code...

[removed]
function onchangeajax(pid)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}

var url="<?php echo URL;?>hostel/ff"
url=url+"?pid="+pid
url=url+"&sid;="+Math.random()
document.getElementById("statediv")[removed]='Please wait..<img border="0" src="<?php echo URL;?>public/images/ajax-loader.gif">'
if(xmlHttp.onreadystatechange=stateChanged)
{
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
return true;
}
else
{
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
return false;
}
}

function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("statediv")[removed]=xmlHttp.responseText
return true;
}
}

function GetXmlHttpObject()
{
var objXMLHttp=null
if (window.XMLHttpRequest)
{
objXMLHttp=new XMLHttpRequest()
}
else if (window.ActiveXObject)
{
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
}
return objXMLHttp;
}
[removed]
<h3>ADD ROOM</h3>
&lt;form name="room_allocate" id="room_allocate" acti echo URL;?&gt;hostel/allocate_room" method="post"&gt;
<table width="100%" border="0" cellspacing="3" cellpadding="2">
<tr>
<td>Student Name :</td>
<td><select name="student_id" id="student_id">
<option value="0">-- Select --</option>
&lt;?php
foreach($this->studentlist as $key=> $value){?&gt;
<option value="&lt;?php echo $value['student_id']; ?&gt;">&lt;?php echo $value['student_name']; ?&gt;</option>
&lt;?php } ?&gt;
</select></td>
</tr>
<tr>
<td width="29%">Hostel Name :</td>
<td width="71%"><select name="hostel_id" id="hostel_id" onchangeajax(this.value);">
<option value="0">-- Select --</option>
&lt;?php
foreach($this->hostellist as $key=> $value){?&gt;
<option value="&lt;?php echo $value['hostel_id']; ?&gt;">&lt;?php echo $value['hostel_name']; ?&gt;</option>
&lt;?php } ?&gt;
</select></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&lt;input type="submit" name="submit" id="submit" value="Add Room" /&gt;&lt;/td>
</tr>
</table>
&lt;/form&gt;
<div id="statediv">
</div>

--------------------------------------------

And my table which is show after change the value of dropdown is something like this,

&lt;?php
$val=$_REQUEST['hostel_id'];
?&gt;
<table width="100%" border="0" cellspacing="3" cellpadding="2">
<tr>
<td>SL No.</td>
<td>Room No.</td>
<td>Students Per Room</td>
<td>Availability</td>
<td>Rent</td>
<td>Status</td>
</tr>
&lt;?php
$slno;
$result=$db->query("SELECT * FROM `rooms` WHERE hostel_name='$val'");
while($line = $db->fetchNextObject($result)) {
$slno++;
?&gt;
<tr>
<td>&lt;?php echo $slno;?&gt;</td>
<td>&lt;?php echo $line->room_no;?&gt;</td>
<td>&lt;?php echo $line->stud_proom;?&gt;</td>
<td>&lt;?php //echo $line->room_no;?&gt;</td>
<td>&lt;?php echo $line->rent;?&gt;</td>
<td>&lt;?php //echo $line->room_no;?&gt;</td>
</tr>
&lt;?php } ?&gt;
</table>

but i didn't understand in mvc how can i write this code...

can anyone help me?????????

my task is in dropdwon there is a list of hostel name, when we select an hostel name, it shows the room details of that hostel related..

plz help me for this
Thanks..
#2

[eluser]TheFuzzy0ne[/eluser]
First of all, please post any code using code tags. It makes it easier for us to read, and easier for us to help you.

You might also want to look into [url="http://jquery.com/"]jQuery[/url]. It's pretty simply to use once you get your head around it. You'd set up a [url="http://api.jquery.com/change/"]change[/url] listener on your dropdown box, and use [url="http://api.jquery.com/load/"]load()[/url] to load the content. It's ridiculously easy, and the documentation is pretty straight-forward, and you'd use a lot less code than you've posted. On top of this, it supports all of the most popular browsers, so you don't have to worry about differences between them.

We're not here to write your code for you, but we can point you in the right direction.
#3

[eluser]rana[/eluser]
* first thing, Please wrap your code between \[code\] and \[/code\] tag.

* Please try to learn jquery or similar javascript library to avoid writing large code for ajax implementation.

* Start with small. first just take simple request and verify that response is getting. then try bigger. use $.post to submit a forms data.

* There is a similar thread on stackoverflow: http://stackoverflow.com/questions/13887...ax-example

Hope this will help. If still problem happening, please ask the specific portion, so that we can catch quick. Thanks.
#4

[eluser]rash[/eluser]
Hi,

thanks for the reply
but i didn't get the jquery and stackoverflow code,
can u show me a example of this.....
i only enganged in php that be procedural, now i learning mvc format..
so, i only do the implementation of jquery, javasceipt and ajax.....no that much of idea....
can u plz help me..by showing a example of this




Theme © iAndrew 2016 - Forum software by © MyBB