Seems like I can't make Ajax to call the PHP file and I can't figure out what or where the problem is. I`m trying to make a module that reads from database and it should display a form with options to select. The form gets populated but when I'm changing an option, it won't display the message.
Basically, it's a module that will list some stores available in database (id, name and email) and when a store is selected, the email should print out. I'm using this as example: http://www.w3schools.com/PHP/php_ajax_database.asp
Here is what I did until now:
in app\code\local\AdiGh\askStore\etc\config.xml
<frontend>
<routers>
<askstore>
<use>standard</use>
<args>
<module>AdiGh_askStore</module>
<frontName>estores</frontName>
</args>
</askstore>
</routers>
<layout>
<updates>
<askstore>
<file>estores.xml</file>
</askstore>
</updates>
</layout>
in app\code\local\AdiGh\askStore\controllers\IndexController.php
and AjaxController
(a file with same code just _AjaxController
becomes _IndexController
class AdiGh_askStore_AjaxController extends Mage_Core_Controller_Front_Action
{
public function indexAction()
{
$this->loadLayout();
$this->renderLayout();
}
}
in c:\Users\Adi\Desktop\askStore\app\design\frontend\default\default\layout\estores.xml
<layout version="0.1.0">
<default>
<reference name="content">
</reference>
</default>
<askstore_index_index>
<reference name="content">
<block type="askstore/askstore" name="askstore" template="estores/estores.phtml" />
</reference>
</askstore_index_index>
<askstore_ajax_index>
<reference>
<block type="askstore/askstore" name="root" template="estores/estores.phtml" output="toHtml">
</block>
</reference>
</askstore_ajax_index>
and the estores.phtml
found in app\design\frontend\default\default\template\
has this:
<?php
$theIds = $this->getId();
?>
<?php echo get_class($this)."<br />"; ?>
<script type="text/javascript">
function showEmail(str)
{
if (str=="")
{
document.getElementById("response").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("response").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajax/index/store/q="+str,true);
xmlhttp.send();
}
</script>
<form name='myForm'>
Choose Store:
<select name="store" id="store" onChange="showEmail(this.value);">
<option value="">Please select a store</option>
<?php foreach ($theIds as $i => $theId) : ?>
<?php
$theNames = $this->getName();
$theName = $theNames[$i];
?>
<option value="<?php echo $theId; ?>"><?php echo $theName; ?></option>
<?php endforeach; ?>
</select>
</form>
<?php echo $this->theResponse() ?>
<?php
?>
Email: <div id="response"></div>
The AskStore.php
block that is under app\code\local\AdiGh\askStore\Block\
class AdiGh_askStore_Block_AskStore extends Mage_Core_Block_Template
{
public function getId()
{
$iduri='';
$collection = Mage::getModel('adigh_askstore/estores')->getCollection()->setOrder('id','asc');
foreach($collection as $data)
{
$iduri .= $data->getData('id') .',';
}
Mage::getSingleton('adminhtml/session')->addSuccess('Cool Ca marche !!');
return explode(',' , $iduri );
}
public function getName()
{
$name='';
$collection = Mage::getModel('adigh_askstore/estores')->getCollection()->setOrder('id','asc');
foreach($collection as $data)
{
$name .= $data->getData('name') .',';
}
Mage::getSingleton('adminhtml/session')->addSuccess('Cool Ca marche !!');
return explode(',' , $name );
}
public function getEmail()
{
$email='';
$collection = Mage::getModel('adigh_askstore/estores')->getCollection()->setOrder('id','asc');
foreach($collection as $data)
{
$email .= $data->getData('email') .',';
}
Mage::getSingleton('adminhtml/session')->addSuccess('Cool Ca marche !!');
return explode(',' , $email );
}
public function theResponse() {
$q = intval($_GET['q']);
if($q==0)
{
echo "store is 0";
}
elseif ($q>0){
$read = Mage::getSingleton( 'core/resource' )->getConnection( 'core_read' ); // To read from the database
$productTable = Mage::getSingleton( 'core/resource' )->getTableName( 'adigh_askstore/estores' );
$query = "SELECT * FROM " . $productTable . "WHERE id = '".$q."'";
$result = $read->query($query);
while ( $row = $result->fetch() ) {
echo 'ID: ' . $row['id'] . '<br>';
echo 'ID: ' . $row['name'] . '<br>';
echo 'ID: ' . $row['email'] . '<br>';
}
}
print_r($result);
}
}
So, as I said, it connects to the database and populates the select form with the right options and values. But when I access it under localhost/estores/index
it will display the right form but onChange will reload the page without displaying the result. I will be more than grateful to read some constructive opinions.
Thanks a lot!
Best Answer
Ok.. figured it out with the help of a user from stackoverflow @Mage_Zeus. What I did was actually calling theResponse public function from myblock.php in the controller with
and then tweaked
theResponse
function to actually do what I needed. Thank you everyone for your great support! It really helped me go through this.