Magento custom search form - php

I am trying to create custom search functionality in Magento 1.9. Instead of writing it from scratch, I want to piggy back the default search functionality and add in custom filters. First I copied the form.min template and replaced with drop downs that I want to use.
form.custom.phtml:
<?php
$catalogSearchHelper = $this->helper('catalogsearch');
$_helper = Mage::helper('catalog/category');
$_categories = $_helper->getStoreCategories();
?>
<form id="search_custom_form" action="<?php echo $catalogSearchHelper->getResultUrl() ?>" method="get">
<div class="select-box item">
<label for="finder">GIFT FINDER</label>
<select id="customS" name="finder">
<option value="">Please select</option>
<?php
foreach ($_categories as $key => $value) {
echo("<option value='" . $value["name"] . "'>" . $value["name"] . "</option>");
}
?>
</select>
</div>
<div class="item">
<label for="for">FOR</label>
<select id="for">
<option value="">Please select</option>
<option value="him">HIM</option>
<option value="her">HER</option>
</select>
</div>
<div classs="item">
<label for="delivery">DELIVERY OPTION</label>
<select id="delivery">
<option value="express">EXPRESS DELIVERY</option>
<option value="standard">STANDARD POST</option>
</select>
</div>
<div classs="item">
<label for="price">DELIVERY OPTION</label>
<select id="price">
<option value="<250">LESS THAN £250</option>
<option value=">250">MORE THAN £250</option>
</select>
</div>
<button type="submit" title="<?php echo $this->__('Find') ?>" class="button search-button"><span><span><?php echo $this->__('Find') ?></span></span></button>
<script type="text/javascript">
//<![CDATA[
var searchForm = new Varien.searchForm('search_custom_form', '', '');
//]]>
</script>
</form>
I have included the above template on my home page using {{block type="core/template" name="custom-search" as="custom-search" template="catalogsearch/form.custom.phtml"}}, I have copied the core files into my own template folder and now I find myself stuck.
Can anyone offer a better alternative or solution as to what I should do?
Thanks

Found a much easier option here. I copied the catalogsearch folder to my theme, copied the advanced search form and placed it on my home page. Now I can customise the form and the query as I see fit.

Related

About Using Multi Select?

Hi I'm working on the code now and the ticket system sending a notification to a user that selects him about.
I want a notification to select more than one user and more than one user.
I tried to use this for Multi Select more than one user selection, again when I say save too, a single user is registering on this can you help me ?
<div class="form-group select-placeholder">
<label for="assigned" class="control-label">
<?php echo _l('ticket_settings_assign_to'); ?>
</label>
<select name="assigned" id="assigned" class="form-control selectpicker" data-live-search="true" data-none-selected-text="<?php echo _l('dropdown_non_selected_tex'); ?>" data-width="100%">
<option value=""><?php echo _l('ticket_settings_none_assigned'); ?></option>
<?php foreach($staff as $member){ ?>
<option value="<?php echo $member['staffid']; ?>" <?php if($member['staffid'] == get_staff_user_id()){echo '';} ?>>
<?php echo $member['firstname'] . ' ' . $member['lastname'] ; ?>
</option>
<?php } ?>
</select>
</div>
If you want to be able to select multiple you have to add the multiple attribute to the box.
<select multiple>
To receive the values in your code as an array you should change the name from name="assigned" to name="assigned[]"
This will send the multi selected data back as an array to PHP or whichever language you are using
<select multiple name="assigned[]" id="assigned" class="form-control selectpicker" data-live-search="true" data-none-selected-text="<?php echo _l('dropdown_non_selected_tex'); ?>" data-width="100%">
You have to put the multiple attribute in your <select> tag.
Note: The javascript there is used to avoid holding the ctrl-key while selecting multiple options.
window.onmousedown = function (e) {
var el = e.target;
if (el.tagName.toLowerCase() == 'option' && el.parentNode.hasAttribute('multiple')) {
e.preventDefault();
// toggle selection
if (el.hasAttribute('selected')) el.removeAttribute('selected');
else el.setAttribute('selected', '');
// hack to correct buggy behavior
var select = el.parentNode.cloneNode(true);
el.parentNode.parentNode.replaceChild(select, el.parentNode);
}
}
<select name="option-list" size="5" multiple>
<option value="option-1">Option</option>
<option value="option-2">Option</option>
<option value="option-3">Option</option>
<option value="option-4">Option</option>
<option value="option-5">Option</option>
<option value="option-6">Option</option>
<option value="option-7">Option</option>
<option value="option-8">Option</option>
<option value="option-9">Option</option>
</select>
I organized the code this way. But I couldn't get a successful result.
<div class="form-group select-placeholder">
<label for="assigned" class="control-label">
<?php echo _l('ticket_settings_assign_to'); ?>
</label>
<select multiple name="assigned[]" id="assigned" class="form-control selectpicker" data-live-search="true" data-none-selected-text="<?php echo _l('dropdown_non_selected_tex'); ?>" data-width="100%">
<option value=""><?php echo _l('ticket_settings_none_assigned'); ?></option>
<?php foreach($staff as $member){ ?>
<option value="<?php echo $member['staffid']; ?>" <?php if($member['staffid'] == get_staff_user_id()){echo '';} ?>>
<?php echo $member['firstname'] . ' ' . $member['lastname'] ; ?>
</option>
<?php } ?>
</select>
</div>

Using $_GET and $_POST in custom WordPress plugin

I'm new to developing plugins for WordPress, I've been doing it for Magento 2 and thought it would be similar, so here I am.
I'm consuming a RESTful API to display information about some courses, it retrieves me the info on all courses so now I have to filter some attributes, for example "city", for this my user has an HTML form to select which city he is in, but when I try to use the "city" field from the form it returns as null, it doesn't matter if I use post or get method.
Which one is the correct form of getting this attributes in WordPress?
this is an example of the form page:
<?php
/*
* Formulario de filtros
*/
// create curl resource
require_once('../../../../wp-config.php');
$ciudad = $_POST['ciudad'];
var_dump($ciudad);
$accessToken = '---';
$apiUrl = 'url';
$curl = curl_init($apiUrl);
curl_setopt($curl, CURLOPT_HTTPHEADER, ['Authorization: Bearer '.$accessToken]);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
$json = curl_exec($curl);
$cursos = json_decode($json);
$arr = 0;
foreach($cursos as $k => $cur)
{
$sede = $cur->Sede;
if($sede === 'MEDELLIN' ){
$codigo[] = substr($cur->Programa, 0, 4);
$programa[] = $cur->Programa;
$precio[] = $cur->Valor_Contado;
}
}
$cod = array_unique($codigo);
var_dump($cod);
foreach ($cod as $c){
echo "Programa: ".$c."<br>";
}
?>
<div class="filtrosContainer">
<form class="filtro-cursos" method="post">
<div class="vc_row wpb_row vc_row-fluid edgtf-section edgtf-content-aligment-left"><div class="clearfix edgtf-full-section-inner"><div class="wpb_column vc_column_container vc_col-sm-6"><div class="vc_column-inner "><div class="wpb_wrapper">
<div class="wpb_text_column wpb_content_element ">
<div class="wpb_wrapper">
<label>Metodología</label>
<select name="metodologia" id="metodologia" class="metodologia">
<option selected>--Seleccione--</option>
<option value="PRESENCIAL" required>Presencial</option>
<option value="VIRTUAL">Virtual</option>
</select>
<div id="ciudadDiv">
<label>Ciudad</label>
<select name="ciudad" id="ciudad">
<option value="none" selected>--Seleccione--</option>
<option value="MEDELLIN" required>Medellín</option>
<option value="BOGOTA">Bogotá</option>
<option value="BARRANQUILLA">Barranquilla</option>
<option value="BUCARAMANGA">Bucaramanga</option>
<option value="MANIZALES">Manizales</option>
<option value="CALI">Cali</option>
</select></div>
<label>Programa</label>
<select name="programa" id="programa">
<?php
if($ciudad === "MEDELLIN"){ ?>
<option value="none" selected>--Seleccione--</option>
<option value="none" selected>PreUdeA</option>
<option value="none" selected>PreUnal</option>
<option value="none" selected>PreICFES Saber 11°</option>
<option value="none" selected>PreMédico</option>
<option value="none" selected>PreUdeA</option>
<?php }else{
echo $ciudad;
}
?>
</select>
</div>
</div>
</div></div></div><div class="wpb_column vc_column_container vc_col-sm-6"><div class="vc_column-inner "><div class="wpb_wrapper">
<div class="wpb_text_column wpb_content_element ">
<div class="wpb_wrapper">
<label>¿Cuando presentarás el examen?</label>
<select name="semestre" id="semestre">
<option value="none" selected>--Seleccione--</option>
<option value="2019-1" selected>2019-1</option>
<option value="2019-2" selected>2019-2</option>
</select>
<div id="jornadaDiv">
<label>Jornada</label>
<select name="jornada" id="jornada">
<option value="none" selected>--Seleccione--</option>
<option value="SEMANA" selected>Semana</option>
<option value="FINDE" selected>Fin de semana</option>
</select>
</div>
<button type="submit" name="submit" value="Filtrar">Filtra tu programa</button>
</div>
</div>
</div></div></div></div></div>
</form>
</div>
After some research and trying several ways I tryed out the code all together in the main PHP file of my custom plugin instead of using the require_once.
I had the next estructure:
wp-content>>plugins>>myplugin>>myplugin.php
and in said php file had a require_once for:
wp-content>>plugins>>myplugin>>php>>form.php
it seems you can't use $_POST, $_GET, not evev cookies in the files outside the main php file so I had to work all my code in there and forget about mu php folder and eny MVC structure.

Make certain criteria appear when selection is made?

User have some options, upon selecting one of them, I want to show more options which will depend on first selected option. Say, user has options to select the number of gates, like 1 or 2. Upon selecting a number I want to show options of all the gates lower than that number. That is,
if 1 is selected, show options of only gate 1.
if 2 is selected, show options of gate 2 and gate 1.
I have most of the variables within my phpmyadmin for storage purposes to avoid having to create alot of variables in the code. Just want some suggestions and if you see anything I can improve let me know.
<div class="form-div-element">
<label># of Gates</label>
<select class="gates-change" name="no_gate" required>
<option value="">Select Gate</option>
<option value="28">1 Gate</option>
<option value="29">2 Gates</option>
</select>
</div>
<?php
if($result)
{
foreach($result as $row)
{
if($row->id == 31 || $row->id == 32 || $row->id == 33)
{?>
<div class="form-div-element ecl-variation ecl-variation<?php echo $row->id;?>" style="display:block!important">
<?php }
else
{?>
<div class="form-div-element ecl-variation ecl-variation<?php echo $row->id;?>">
<?php }?>
<label><?php echo $row->variation_name;?></label>
<?php
if($row->variation_name == 'Stops')
{?>
<input type="hidden" name="stopvariationid" value="<?php echo $row->id;?>" id="stopvariationid"/>
<?php }
?>
<?php
$var_value = (explode("|",$row->variation_value));
$var_condition = $row->conditions;
$arr = array('height_convert_configuration');
//if($row->special_features != '')
//{
// check_special_function($var_value,$row->special_features,$var_condition);
//}
//else if($row->variation_type =='selectbox')
if($row->variation_type =='selectbox')
{
if($row->variation_function == 'calculation')
{?>
<select onchange = 'change_variation(this.value,<?php echo $row->id;?>)'>
<option value="">Select Option</option>
<?php for($i=0;$i<count($var_value);$i++)
{?>
<option value="<?php echo $var_value[$i];?>"><?php echo $var_value[$i];?></option>
<?php }?>
</select>
<?php }
else
{ ?>
<select class="gate_datatype" name="gate_type">
<option value="">Select Option</option>
<?php for($i=0;$i<count($var_value);$i++)
{?>
<option value="<?php echo $var_value[$i];?>|<?php echo $row->special_features;?>"><?php echo $var_value[$i];?></option>
<?php }?>
</select>
<?php }
}
else if($row->variation_type =='textbox')
{?>
<?php for($i=0;$i<count($var_value);$i++)
{?>
<?php echo $var_value[$i];?>
<?php }?>
<?php }
else if($row->variation_type =='radiobox')
{?>
<?php for($i=0;$i<count($var_value);$i++)
{?>
<div class="radiobox-cont">
<input onchange = 'change_radio_variation(this,this.value,<?php echo $row->id;?>)' type="radio" name="<?php echo $row->class;?>" value='<?php echo $var_value[$i];?>' /><?php echo $var_value[$i];?>
</div>
<?php }?>
<?php }
else if($row->variation_type =='checkbox')
{?>
<?php for($i=0;$i<count($var_value);$i++)
{?>
<div class="checkbox-cont <?php echo preg_replace('/\s+/', '_', $var_value1[$i]);?>">
<?php if('Cabin Telephone' == $var_value[$i])
{?>
<input checked type="checkbox" onchange="change_check_varitaion(this,this.value,<?php echo $row->id;?>)" name="other_option[]" value='<?php echo $var_value[$i];?>' disabled="disabled" /><?php echo $var_value[$i];?>
<?php }
else
{?>
<input type="checkbox" onchange="change_check_varitaion(this,this.value,<?php echo $row->id;?>)" name="other_option[]" value='<?php echo $var_value[$i];?>' /><?php echo $var_value[$i];?>
<?php }?>
</div>
<?php }?>
<?php }?>
</div>
<?php }
You can do this in two ways first way is to do ajax and second way is using css.
First method suppose this is your select code where you can select gate
<div class="form-div-element">
<label># of Gates</label>
<select id="gates" onchange="change()" class="gates-change" name="no_gate" required>
<option value="">Select Gate</option>
<option value="28">1 Gate</option>
<option value="29">2 Gates</option>
</select>
</div>
// and this is your sub gates options which will be empty at first and its display will be none
<div id="subgates_div" class="form-div-element" style="display:none;">
<label># of Sub Gates</label>
<select id="subgates" class="gates-change" name="sub_no_gate" required>
<option value="">Select Sub Gate</option>
</select>
</div>
on selecting gate what you can do is use ajax to get the sub options of the selected gate like this. in this code your url and my url will be different.
function change() {
var selected = $('#gates').find(":selected").attr("value");
$.ajax({
type: "POST",
url: '<?php echo base_url('get_sub_options') ?>',
dataType: 'json',
data: {category: selected},
success: function (data) {
console.log(data);
//remove disabled from province and change the options
$('#subgates_div').show();
$('select[name="sub_no_gate"]').html(data.subgates);
}
});
}
and your php function should be like this here first i have made an array named subgates. and i have retrieved subgates from database using the value from post. this query might be different in your case. the i have applied foreach loop for sub gates and created a new option element with respective subgate id and subgate name and appended it to array. and at last the array is returned using json_encode
function get_sub_category() {
$data['subgates'] = array();
$subgates = $this->db->get_where('subcategories', array('id' => $_POST['category']))->result();
foreach ($subgates as $key => $val) {
$data['subgates'][] = <<<EOD
<option value='$val->id'>$val->sub_gate_name</option>
EOD;
}
echo json_encode($data);
}
and the other method is using css. to do this you should list all this options of gate and subgates at first. like this
// gates options
<div class="form-div-element">
<label># of Gates</label>
<select id="gates" onchange="change()" class="gates-change" name="no_gate" required>
<option value="">Select Gate</option>
<option value="28">1 Gate</option>
<option value="29">2 Gates</option>
</select>
</div>
//sub gate options one
<div id="subgates-<?php echo $subgates->id; ?>" class="form-div-element" style="display:none;">
<label># of Sub Gates</label>
<select id="subgates" class="gates-change" name="sub_no_gate" required>
<option value="">Select Sub Gate</option>
</select>
</div>
//sub gate option 2
<div id="subgates-<?php echo $subgates->id; ?>" class="form-div-element" style="display:none;">
<label># of Sub Gates</label>
<select id="subgates" class="gates-change" name="sub_no_gate" required>
<option value="">Select Sub Gate</option>
</select>
</div>
// and so on
In this case what you should remember is that your sub gates option div id should be dynamic and display will be none at first
now when you select a gate use onchange and change the display css of respective sub gates like this
function change() {
$(".form-div-element").hide();
var selected = $('#gates').find(":selected").attr("value");
$('#subgates-'+selected).show();
}
hope this will give you some idea and if you have any confusion feel free to ask
All in all it seems to me that your question actually contains 2 questions:
How to dynamically show/hide DOM elements based on user selection
Upon selecting a number I want to show options of all the gates lower than that number.
How to optimize your PHP code
Just want some suggestions and if you see anything I can improve let me know.
Number two is way to broad! Maybe just one quick suggestion: If it works then its fine. Overlooked it fast and seems to be ok.
See my working snippet for number one, which actually only needs a little customization of your existing source code (if any at all). Don't forget its just a mockup; if you need some further help or want some deeper explanations about whats going on then let me know...
jQuery('.form-div-element').not('.ecl-variation').find('select').on('change', function() {
var i = -1,
$conditional = jQuery('.ecl-variation').hide(), // hide in advance
iGates = +(jQuery(this).find('option:selected').attr('data-gates-sum')); // get required gate(s) based on selected options "data-gates-sum"-attribute
// version based on text: `iGates = +($(this).find('option:selected').text().split(' ')[0])` | pro: no additional markup, con: error prone, maintenance
// count up to required gate(s) and make them visible
while ( ++i < iGates ) {
$conditional[i].style.display = 'block';
}
});
.ecl-variation{
display: none; /* hide conditional selects in advance */
}
<!-- minimized mockup -->
<div class="form-div-element">
<label># of Gates</label>
<select>
<option value="">Select Gate</option>
<!-- decided to add a data attribute instead of relying on text which could change more likely (maintenance) -->
<option value="28" data-gates-sum="1">1 Gate</option>
<option value="29" data-gates-sum="2">2 Gates</option>
</select>
</div>
<div class="form-div-element ecl-variation">
<label># of Gates | conditial 1</label>
<select>
<option value="">Select Gate Sub</option>
<option value="3">abc</option>
<option value="4">xyz</option>
</select>
</div>
<div class="form-div-element ecl-variation">
<label># of Gates | conditial 2</label>
<select>
<option value="">Select Gate Sub</option>
<option value="5">123</option>
<option value="6">789</option>
</select>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
How to implement?
.ecl-variation{
display: none; /* hide conditional selects in advance */
}
<body>
<!-- minimized mockup -->
<div class="form-div-element">
<label># of Gates</label>
<select>
<option value="">Select Gate</option>
<option value="28" data-gates-sum="1">1 Gate</option>
<option value="29" data-gates-sum="2">2 Gates</option>
</select>
</div>
<div class="form-div-element ecl-variation">
<label># of Gates | conditial 1</label>
<select>
<option value="">Select Gate Sub</option>
<option value="3">abc</option>
<option value="4">xyz</option>
</select>
</div>
<div class="form-div-element ecl-variation">
<label># of Gates | conditial 2</label>
<select>
<option value="">Select Gate Sub</option>
<option value="5">123</option>
<option value="6">789</option>
</select>
</div>
<!-- YOUR CODE ENDS HERE -->
<!-- load jquery from cdn -->
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
<!-- provide a local copy as fallback in case that cdn is not available -->
<script>window.jQuery||document.write('<script src="path/to/your/local/copy/jquery-1.12.4.min.js"><\/script>')</script>
<!-- implement your custom site specific script(s) inline -->
<script>
(function( $ ) {
$('.form-div-element').not('.ecl-variation').find('select').on('change', function() {
var i = -1,
$conditional = $('.ecl-variation').hide(),
iGates = +($(this).find('option:selected').attr('data-gates-sum'));
while ( ++i < iGates ) {
$conditional[i].style.display = 'block';
}
});
})( jQuery )
</script>
<!-- instead of deploying your scripts inline you can load them also like this:
<script src="path/to/your/app.js"></script>
-->
</body><!-- make sure that your scripts are located just before the closing body tag -->

php dynamic dropdown menu get value

i am trying to do a dynamic dropdown menu, i manage to retrieve the first menu value but i can't manage to retrieve the second menu value.
HTML part
<div>
<label for="marca">Marca </label>
<select type="text" id="marca" name="marca" onChange="getModel()">
<option value="">Alege Marca</option>
<?php while($row = mysqli_fetch_assoc($resultMarca)){ ?>
<option value="<?php echo $row["id"] ?>"> <?php echo $row["nume_marca"] ?> </option>
<?php } ?>
</select>
</div>
<div id="model_masina">
<label for="model">Model </label>
<select id="model" nume="model">
<option value="">Alege Model</option>
</select>
</div>
Ajax Part
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script type ="text/javascript">
function getModel(){
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","get_model.php?marca="+document.getElementById("marca").value, false);
xmlhttp.send(null);
document.getElementById("model_masina").innerHTML=xmlhttp.responseText;
}
function model_schimba(){
$modelSc = (document.getElementById("model").value);
}
</script>
PHP
?>
<label for="model">Model </label>
<select id="model" nume="model" onchange='model_schimba()'>
<option value="">Alege Model</option>
<?php
while($row = mysqli_fetch_array($res)){ ?>
<option value="<?php echo $row["id"] ?>"> <?php echo $row["name"] ?> </option>
<?php }
?> </select> <?php
}
i mange to take the variable here
$modelSc = (document.getElementById("model").value);
but when i push the submit button i can't reach the variable
$model = $_POST["model"];
"but when i push the submit button i can't reach the variable $model = $_POST["model"];"
nume="model"
PHP syntax is English-based, not in your language.
You need to change it to name="model".
The "name" attribute is the same in any language.
Having use PHP's error reporting, it would have thrown you an undefined index notice.
http://php.net/manual/en/function.error-reporting.php
First, code separation is important for readability.
Second, I think your AJAX return
document.getElementById("model_masina").innerHTML=xmlhttp.responseText;
is mistakenly pointing at a <div> container instead of the <select> list. Should be,
document.getElementById("model").innerHTML=xmlhttp.responseText;
because you are outputting select menu <option>

php if dropdown option value 0 then hide div

as I am not experienced with php, I need some help solving my issue.
I pasted the snippet of php I believe needs editing.
<div class="selectBox" id="products-variation-container">
<select class="product-variation-dropdown" name="product-variation" id="sel-product-variation">
<option value="0"><?php _e('Select variation', 'wp-woo-leasing'); ?></option>
</select>
</div>
<!-- <input type="submit" name="btn-submit" class="button alt" id="leasingAddItem" value="<?php _e('Add Item', 'wp-woo-leasing'); ?>"
data-value="<?php _e('Add Item', 'wp-woo-leasing'); ?>" />-->
</div>
</div>
<div class="leasing-single-container" >
<div class="leasing-col1" >
<div id="product-description" class="product-description"></div>
<div id="product-price-details" class="product-price-details"></div>
</div>
My issue is that I want my code to be like:
<select class="product-variation-dropdown" name="product-variation" id="sel-product-variation">
<option value="0"><?php _e('Select variation', 'wp-woo-leasing'); ?>
If option value = "0" then hide the following div, upon loading site, since default is value is 0.
<div id="product-description" class="product-description"></div>
I hope you understand my question, and I hope that you can guide me to approaching this issue, thanks.
You can use jQuery to show and hide div on basis of select value.
Wordpress have already included jquery file, so you no need to add it.
(https://developer.wordpress.org/reference/functions/wp_enqueue_script/).
Here is code you can use:
<div class="selectBox" id="products-variation-container">
<select class="product-variation-dropdown" name="product-variation" id="sel-product-variation" onchange="getval();">
<option value="0">Select Option</option>
<option value="1">Select Option1</option>
</select>
</div>
<div class="leasing-single-container" >
<div class="leasing-col1" >
<div id="product-description" class="product-description">dgsdgsdgsdgsdgsd</div>
<div id="product-price-details" class="product-price-details"></div>
</div>
</div>
<script>
jQuery(document).ready(function() {
var sel = jQuery('select[name=product-variation]').val();
if(sel == 0) {
jQuery('#product-description').attr('style', 'display:none');
}
jQuery('#sel-product-variation').on('change', function() {
var sel = jQuery('select[name=product-variation]').val();
if(sel == 0) {
jQuery('#product-description').attr('style', 'display:none');
}
else {
jQuery('#product-description').attr('style', 'display:block');
}
});
});
</script>
Let me know incase of any concern for the same.

Categories