How to redirect particular page based on selected dropdown options

Question

We are Displaying Drop-down options here using values Present in Backend

After selecting dropdown options & if we click on "See Cases", we are redirecting to particular product [ id : 44 ] using below code.

local/Company/Brand/Block/Frontend/View.php

public function getProduct()
    {           
        $product =  Mage::getModel('catalog/product')->load(44);
            $p=Mage::registry('product');
            if ($p=='') {Mage::register('product', $product);}
            return  $product;
        }

But we want to do some ajax coding [ or any other way] & we have to redirect to Particular Brand & Model selected in Dropdown options as here . below code is for selecting dropdown options :

<div class="custom_case">
    <div class="custom_case_left">
        <h1 class="cc1">Custom Cases</h1>
        <h2 class="cc2">Make Your Own design</h2>
    </div>

<?php

$resource = Mage::getSingleton('core/resource');

$readConnection = $resource->getConnection('core_read');

$writeConnection = $resource->getConnection('core_write');

$readConnection = $resource->getConnection('core_read');

$query = 'SELECT category_id, category_name FROM ' . $resource->getTableName('outthink_advance_brand_category');

$categories = $readConnection->fetchAll($query);

$brandsArr = array();

$brandSelect = '<select id="brand_select">';
$brandSelect .= '<option value="">My Brand</option>';
foreach ($categories as $category){
$cat_id = $category["category_id"];

$brandSelect .= "<option value='".$category["category_id"]."'>".$category["category_name"]."</option>";

$query = 'SELECT `outthink_advance_brand`.brand_id, `outthink_advance_brand`.bmodel FROM `outthink_advance_brand` ';
$query .= ' inner join `outthink_advance_brand_category_item` on
(`outthink_advance_brand`.brand_id = `outthink_advance_brand_category_item`.brand_id )';
$query .= ' where `outthink_advance_brand_category_item`.category_id = '.$cat_id;

$brands = $readConnection->fetchAll($query);

$bArr = array();

foreach ($brands as $brand){
$bArr[$brand["brand_id"]] = $brand["bmodel"];
}
$brandsArr[$cat_id] = $bArr;
}
$brandSelect .= '</select>';

echo $brandSelect;
echo '<select id="model_select"><option value="">My Model</option></select>';
?>


<div class ="cc3">
<div class ="cc4">
<a href="http://sbdev2.kidsdial.com/customized-mobile-cases/customcase/"><span class ="cc5"> See Cases > </span> </a>
</div>

</div>



<script>
var models = <?php echo json_encode($brandsArr) ?>;

jQuery(document).ready(function(){

jQuery( "#brand_select" ).change(function() {
var brandId = jQuery(this).val();
jQuery('#model_select').empty().append('<option value="">MY MODEL</option>');

jQuery.each(models[brandId], function(key,value) {
jQuery('#model_select').append(jQuery('<option>', {
value: key,
text : value
}));
});
});

//trigger change event first time if required
//jQuery( "#brand_select" ).change();
});
</script>

    <div class="custom_case_right">
    <img height="200px;" width="2000px;" src="<?php echo $this->getSkinUrl('images/custom.png'); ?>" >


    </div>
</div>

CustomcaseController.php

class Company_Brand_CustomcaseController extends Mage_Core_Controller_Front_Action
{
    /**
     * Displays the Brand list.
     */
    public function indexAction()
    {

        $this->loadLayout();
        $breadcrumbs = $this->getLayout()->getBlock('breadcrumbs');
        $breadcrumbs->addCrumb('home', array('label'=>Mage::helper('cms')->__('Home'), 'title'=>Mage::helper('cms')->__('Home Page'), 'link'=>Mage::getBaseUrl()));
        $breadcrumbs->addCrumb('brand', array('label'=>$this->__('Brand'), 'title'=>$this->__('Customcase')));
        $this->renderLayout();
    }


}

with help of below answer, i tried this code with alert box, once i click on button its displaying proper Brand & Model ids in pop up box. but its not redirecting to proper page.

<script>
 function geturlandredirec()
{  

 var brand=$('brand_select').value;
 var model=$('model_select').value;
 array = [brand, model];

  alert(array)

   url="<?php echo Mage::getbaseUrl()?>customized-mobile-cases/customcase/ajax";

   new Ajax.Request(url, {
       method: 'POST',  

         onFailure: function(response){
   },
parameters: {
    brand: brand, model: model
  },
 onSuccess: function(response)
 { 
            window.location = response.responseText
   return ;
 }
     }); 
}

 </script> 

i will give 50 bounty if it works for me.

Answer 1

you can add simply and submit on their url and do you code there. that is simple solution for that.

<div class="custom_case">
    <div class="custom_case_left">
        <h1 class="cc1">Custom Cases</h1>
        <h2 class="cc2">Make Your Own design</h2>
    </div>

<?php

$resource = Mage::getSingleton('core/resource');

$readConnection = $resource->getConnection('core_read');

$writeConnection = $resource->getConnection('core_write');

$readConnection = $resource->getConnection('core_read');

$query = 'SELECT category_id, category_name FROM ' . $resource->getTableName('outthink_advance_brand_category');

$categories = $readConnection->fetchAll($query);

$brandsArr = array();

$brandSelect = '<select id="brand_select">';
$brandSelect .= '<option value="">My Brand</option>';
foreach ($categories as $category){
$cat_id = $category["category_id"];

$brandSelect .= "<option value='".$category["category_id"]."'>".$category["category_name"]."</option>";

$query = 'SELECT `outthink_advance_brand`.brand_id, `outthink_advance_brand`.bmodel FROM `outthink_advance_brand` ';
$query .= ' inner join `outthink_advance_brand_category_item` on
(`outthink_advance_brand`.brand_id = `outthink_advance_brand_category_item`.brand_id )';
$query .= ' where `outthink_advance_brand_category_item`.category_id = '.$cat_id;

$brands = $readConnection->fetchAll($query);

$bArr = array();

foreach ($brands as $brand){
$bArr[$brand["brand_id"]] = $brand["bmodel"];
}
$brandsArr[$cat_id] = $bArr;
}
$brandSelect .= '</select>';

echo $brandSelect;
echo '<select id="model_select"><option value="">My Model</option></select>';
?>


<div class ="cc3">
<div class ="cc4">
<a href="#" onclick="geturlandredirec()"><span class ="cc5"> See Cases > </span> </a>
</div>

</div>



<script>
var models = <?php echo json_encode($brandsArr) ?>;

jQuery(document).ready(function(){

jQuery( "#brand_select" ).change(function() {
var brandId = jQuery(this).val();
jQuery('#model_select').empty().append('<option value="">MY MODEL</option>');

jQuery.each(models[brandId], function(key,value) {
jQuery('#model_select').append(jQuery('<option>', {
value: key,
text : value
}));
});
});

//trigger change event first time if required
//jQuery( "#brand_select" ).change();
});
</script>

    <div class="custom_case_right">
    <img height="200px;" width="2000px;" src="<?php echo $this->getSkinUrl('images/custom.png'); ?>" >


    </div>
</div>

second solution use ajax

<script>
  function geturlandredirec()
{  

  var brand=$('brand_select').value;
  var model=$('model_select').value;
    parameters='brand='+brand+'&model='+model';
    url="<?php $this->getUrl('test/test/');?>";
    new Ajax.Request(url, {
        method: 'get',  
        parameters: parameters,
          onFailure: function(response){

    },


  onSuccess: function(response)
  { 


             window.location = response.responseText
    return ;







  }
      }); 
}

  </script> 

controller method

      public function ajaxAction()
{

    $brand=$this->getRequest()->getParam('brand');
    $model=$this->getRequest()->getParam('model');
    $products = Mage::getModel('catalog/product')
          ->getCollection()      ->addAttributeToSelect('*')
          ->addFieldToFilter('brand',$brand)
          ->addFieldToFilter('model',$model);
    $products->getFirstItem();
    echo $_product_url = $products->getProductUrl();



}