I have a select box, and I want to use it to Ajax-update some other content on the page. So I have bound an event handler using the JsHelper (jQuery) like so:
<?php
echo $this->Form->select('car', $cars);
$this->Js->get("#car");
$this->Js->event('change', $this->Js->request(array(
'controller' => 'cars',
'action' => 'view',
???,
array('async' => true, 'update' => '#car-view', 'evalScripts' => true),
true
));
?>
But how can I get the value of the select box to send as an argument to the cars controller (at "???" in the code above)?
I could do everything in javascript, but is there any way to do this in cake?
To be honest, I struggled with this a while back. I couldn't find anything that worked, so I ended up just going the straight javascript route.
I think you are looking for this:
$this->Js->get('#selectbboxid1')->event('change',
$this->Js->request(array(
'action' => 'function'), array(
/*'before' => 'showLoader();',
'success' => 'hideLoader();',*/
'update' => '#selectboxid2',
'dataExpression'=>TRUE,
'method'=>'POST',
'async'=>TRUE,
'data' => $js->serializeForm(array('isForm' => TRUE, 'inline' => TRUE)) )));
Related
i have a problem. I have a code where i can i change my site language, it's on Yii1
echo CHtml::ajaxLink('EN', array('/'), array(
'type' => 'POST',
'success' => 'js:function(res){window.location.reload();}',
'data' => array(
Yii::app()->request->csrfTokenName => Yii::app()->request->csrfToken,
'_lang' => 'en',
)
), array('class' => 'lang_class'));
Please help me to convert it ti Yii2, i dont get it at all.... cause i'm new at it.
Thank you!!!
Well in Yii2 there isn't ajaxLink anymore. So you can do it like this:
First set your link:
Html::a('Link title', 'javascript:void(0);', ['class' => 'changeLangLink']);
After that set js click event to the button and call your ajax.
$('.changeLangLink').click(function(e){
//do you ajax request
alert('Clicked');
});
I've seen many topics about questions like mine, but I can't get any solutions.
I'm using Symfony, and I have a twig template which displays a form.
Imagine that I have this line :
{{ form_row(demandeForm.distinction) }}
Thanks to this :
->add('distinction',null, [
'label_attr' => array('id' => "distinct_form"),
'required' => false,
'label' => 'distinction'
])
I also have a submit button. My wish is to modify the value of my row "distinction" when the button is clicked (id of the submit button : formDepot).
Here is my code :
$(document).ready(function(){
$('#formDepot').click(function(){
$('#distinct_form').value('555');
});
});
When I retrieve my datas on submit, I don't have any value in my "distinction".
Any ideas ?
Thanks
This is because you're applying the changes on the label value, not on the input itself.
'label_attr' => array('id' => "distinct_form") and in js : $('#distinct_form').val('555');
Change the form builder to this :
->add('distinction',
null,
[
'attr' => array('id' => "distinct_form"),
'required' => false,
'label' => 'distinction'
])
With attr for the field (not the label), you can try
$('#distinct_form').val('555'); not .value();
You are assigning a value, instead of getting the value, try this .....
$(document).ready(function(){
$('#formDepot').click(function(){
$('#distinct_form').val();
});
I have created a view with tabs and each tab has a form with ajax submit and gridview. I am using renderpartial in tabs widget to render the form and gridview and after clicking submit it filters the gridview. Everything looks fine within the tab till I click the submit button. After clicking submit it filters the gridview as expected.. but it does not load the bootstrap javascript and css so the layout is totally messed up and the tabs and menu bar all appears as a list and the page keeps on loading.
Anyone know why is it not loading the required scripts and css which I have preload in main config. Do I have to specify something seperately when calling ajax function from a view.
EDIT: Code Added
Code for tabs widget(producers.php)
<?php $this->widget(
'bootstrap.widgets.TbTabs',
array(
'type' => 'tabs',
'tabs' => array(
array('label' => 'Monthly' ,'id' => 'tab1',
'content' => $this->renderPartial('_prod_monthly',array('dataProvider' => $dataProvider,'dataProvider2' => $dataProvider2 ,'dataProvider3' => $dataProvider3, 'opm' => $opm, 'month' => $month),true,true),
'active' => true),
array('label' => 'Weekly' ,'id' => 'tab2',
'content' => $this->renderPartial('_prod_weekly',array('dataProvider4' => $dataProvider4,'dataProvider5' => $dataProvider5 ,'dataProvider3' => $dataProvider3, 'opm' => $opm, 'week' => $week),true,true)),
array('label' => 'Daily', 'id' => 'tab3', 'content' => 'ABC' )),
)); ?>
Code for partial view (_prod_monthly.php):
$form = $this->beginWidget(
'bootstrap.widgets.TbActiveForm',array(
'id' => 'form_monthly',
'enableAjaxValidation'=>true,
'type' => 'inline',
'method' => 'get',
'htmlOptions' => array('class' => 'well','onsubmit'=>"return false;",/* Disable normal form submit */
'onkeypress'=>" if(event.keyCode == 13){ send2(); } " /* Do ajax call when user presses enter key */),)); ?>
Select Month:
<?php echo CHtml::dropDownList('month', $month,
$sel_month); ?>
Select Employee:
<?php echo CHtml::dropDownList('opm', $opm,
$sel_opm); ?>
<?php $this->widget('bootstrap.widgets.TbButton',
array(
'buttonType'=>'button',
'label'=>'Submit',
'type' =>'primary',
'htmlOptions'=> array('onclick' => 'send2()'),)
);
$this->endWidget();
$this->widget('bootstrap.widgets.TbExtendedGridView', array(
'sortableRows'=>true,
'afterSortableUpdate' => 'js:function(id, position){ console.log("id: "+id+", position:"+position);}',
'type'=>'striped bordered hover',
'dataProvider'=>$dataProvider,
'type'=>'striped bordered responsive',
'template' => "{summary}\n{items}\n{extendedSummary}\n{exportButtons}"));?>
<script type="text/javascript">
function send2()
{
var data=$("#form_monthly").serialize();
$.ajax({
type: 'GET',
url: '<?php echo Yii::app()->createAbsoluteUrl("op/producers"); ?>',
data:data,
success:function(data){
document.write(data);
},
error: function(data) { // if error occured
alert("Error occured.please try again");
alert(data);
},
dataType:'html'});
}
</script>
Thanks.
There is no Yii based solution for handling UI-Widgets with AJAX right now and will never come.
Probably, this will never happen again in Yii2. The main Problem is about your missing JS-Ressources and Binding (as you know already). Yii will generate those codes (which you are missing) within the layout process, which is not called on "AJAX"-Requests. Don't try to put in your JS-Ressources by yourself. Yii generated JS-Cods are realy tricky ... and not that easy to handle manualy. This will come up with a lot of problems.
My solution: I dont use any of the "UI"-Features included in Yii. They come along with a lot of problems (Ajax, Multiple announces, etc.). Its not hard to write that features yourself or using jQueryUI.
Take a look at the Tab feature and try write it yourself .. and be happy ! :)
I'm trying to do 3 selects in cakePhp + jQuery first one with provinces, second - localities, third - schools in that place. Here is my cake code (so far):
echo $this->Form->input('proviences', array(
'type' => 'select',
'empty' => true,
'options' => $proviences,
'label' => 'Province',
'class' => 'proviences',
'before' => '<div style="float:left;width:180px"',
'after' => "</div>"
));
echo $this->Form->input('localities', array(
'type' => 'select',
'empty' => true,
'options' => $localities,
'label' => 'City',
'class' => 'localities',
'before' => '<div style="float:left;width:180px"',
'after' => "</div>"
));
$schoolList = array();
foreach($schools as $value) {
$schoolsList[]=$value['name'];
}
echo $this->Form->input('school_id', array(
'label' => 'Szkoła',
'options' => $schoolsList,
'empty' => true,
'before' => '<div style="float:left;width:240px"',
'after' => "</div>",
'onchange' => "submit();",
));
In $schools i have a list looking this way
array(
id1 => array(
'name' => 'some_name',
'province' => 'some_province',
'locality' => 'some_city'
)
)
and using this to get lists of provinces,localities and school names
I was trying to use this but couldn't get it working ;/
Filter three select boxes based on previous selections
Is there a way of doing it in jQuery without ajax?
you can do it without using ajax, but for that you would need the schools array on client side, and create/edit options based on that on the client side, too.
here is a working fiddle. (hastily thrown together, but you get the idea). You need to get the schools array into js, though. you could either use AJAX for that or, pass it as json on the page:
echo 'var schools = JSON.parse('.json_encode($schools).');
You have to think about where to place that, too, so that the variable doesn't leak into the global scope. you could put it in the jQuery closure, for example:
echo '(function($){';
echo 'var schools = JSON.parse('.json_encode($schools).');
// now the javascript from the fiddle...
echo '}(jQuery))';
Experimenting with JsHelper in CakePHP 2.0, I got a Request method to update the value of a form field with the results of an AJAX call - so far, so good. However, on inspecting the form field it says:
<input type="hidden" id="JobsPartUnitcost" name="data[JobsPart][unitcost]">5.55</input>
but when I copied it and first pasted it above it said
<input type="hidden" id="JobsPartUnitcost" name="data[JobsPart][unitcost]"></input>
and when I submitted the form the value was empty. Why is the browser showing the value but the underlying DOM not registering it?
Using Mac/Safari, CakePHP 2.0, JQuery
EDIT
As requested here is form data dump
Array ( [JobsPart] => Array ( [job_id] => 1 [company_id] => 4 [part_id] => 2 [qty] => 3 [unitcost] => ) )
and here is AJAX code
$this->Js->get('#JobsPartPartId')->event('change',
$this->Js->request(
array(
'controller'=>'JobsParts',
'action'=>'getPart'
),
array(
'update'=>'#JobsPartUnitcost',
'async' => true,
'method' => 'post',
'dataExpression'=>true,
'data'=> $this->Js->serializeForm(array(
'isForm' => false,
'inline' => true
))
)
)
);
You need to set the value attribute:
<input type="hidden" value="YOUR VALUE HERE" name="data[Etc][field]" />
You don't wrap a value in input tags.
OK. I have found a workaround and no one else seems to have found a direct solution.
In my static view I now have just <td id="part"></td> where the input field was. My Ajax call now updates '#part' and my dynamic view (the one called by the controller ajax action) now outputs the whole field - <?php echo $this->Form->input('unitcost', array('type' => 'text', 'value' => $part['Part']['costamount'])); ?>. Ugly but it works.
$this->Js->get('#JobsPartPartId')->event('change',
$this->Js->request(
array(
'controller'=>'JobsParts',
'action'=>'getPart'
),
array(
'success'=>'$("#JobsPartUnitcost").val(data)',
'async' => true,
'method' => 'post',
'dataExpression'=>true,
'data'=> $this->Js->serializeForm(array(
'isForm' => false,
'inline' => true
))
)
)
);