When using Yii CListView with Ajax, when I click next or previous button using Yii default Pager, I want to post additional parameters to controller - For example, I want to post search keyword, userid...etc to update criteria in the controller - BUT I DON'T KNOW HOW TO DO THAT.
Can anyone help?
Thanks in advanced,
I think you should to extend CListView component.
public function registerClientScript()
{
/*deleted*/
$options=array(
'ajaxUpdate'=>$ajaxUpdate,
'ajaxVar'=>$this->ajaxVar,
'pagerClass'=>$this->pagerCssClass,
'loadingClass'=>$this->loadingCssClass,
'sorterClass'=>$this->sorterCssClass,
);
/*deleted*/
$cs->registerScript(__CLASS__.'#'.$id,"jQuery('#$id').yiiListView($options);");
}
May be you should append your own params to the options array.
Related
I wrapped my gridview with Pjax widget like this
\yii\widgets\Pjax::begin();
gridview
\yii\widgets\Pjax::end();
in order to make the gridview make ajax request when I click on each pagination.
I also use ['class' => 'yii\grid\CheckboxColumn'], in column as well.
and I find that when I'm on first pagination I checked some rows and then go to second page and check some rows but when I go back to first page what I've checked is gone.
My question is how can I keep all checkedrow for all pagination
With current conditions (Pjax, multiple pages, yii\grid\CheckboxColumn) it's impossible because of the way it works.
When you click on the pagination links all GridView html content is replaced by new one that comes from the AJAX response.
So obviously all selected checkboxes on the previous page are gone.
Few possible ways to solve that:
1) Write custom javascript and server side logic.
As one of the options, you can send AJAX request to server with parameter meaning that user has chosen to select all data for the bulk delete operation (or use separate controller action for bulk deletion). In this case actually we don't need to get the selected data from user, because we can simply get them from database (credits - Seng).
2) Increase number of displayed rows per page.
3) Use infinite scroll extension, for example this.
4) Break desired action in several iterations:
select needed rows on first page, do action (for example, delete).
repeat this again for other pages.
You can get selected rows like that:
$('#your-grid-view').yiiGridView('getSelectedRows');
[infinite scroll] : http://kop.github.io/yii2-scroll-pager/ will work good if you do not have any pjax filters. If you have filters also in play, do not use this plugin as it does not support pjax filters with it. For rest of the applications it is perfect to use.
Update1 : it seems to be straight forward than expected, here is the how I accomplished it
Add following lines to the checkbox column
'checkboxOptions' => function($data){
return ['id' => $data->id, 'onClick' => 'selectedRow(this)'];
}
Now add following JS to the common js file you will have in your project of the page where this datagrid resides
var selectedItems=[]; //global variable
/**
* Store the value of the selected row or delete it if it is unselected
*
* #param {checkbox} ele
*/
function selectedRow(ele){
if($(ele).is(':checked')) {
//push the element
if(!selectedItems.includes($(ele).attr('id'))) {
selectedItems.push($(ele).attr('id'));
}
} else {
//pop the element
if(selectedItems.includes($(ele).attr('id'))) {
selectedItems.pop($(ele).attr('id'));
}
}
}
Above function will store the selected row ids in the global variable array
Now add following lines to pjax:end event handler
$(document).on('pjax:end', function () {
//Select the already selected items on the grid view
if(!empty(selectedItems)){
$.each(selectedItems, function (index,value) {
$("#"+value).attr('checked',true);
});
}
});
Hope it helps.
I just solved this problem and it works properly with Pjax.
You may use my CheckboxColumn. I hope this can help. The checked items are recorded with cookies.
You can read the part with //add by hezll to understand how to fix it, because I didn't provide a complete general one.
Hope it works for you.
https://owncloud.xiwangkt.com/index.php/s/dGH3fezC5MGCx4H
I'm trying to solve a problem. I am new to MVC and trying to understand how the models work. I get the main page and main model stuff and that if you want to show a partial view the data you show must be part of the main model. This makes the main model pretty large and doesn't that require me to submit the entire model to get the partial view? In any case, let's say I have a list of things and one column is a link. This link calls an AJAX method to get more data and display in a jQuery dialog - my goal. So I would have a call like this:
function showDetails(id) {
$("#divShowDetails").load('#(Url.Action("GetDetails", "Home", null, Request.Url.Scheme))?Id= ' + id);
}
My view is like "_DetailsView.cshtml", defined as a partial view. Does this page need to define the model in the main page or can it be a different model or no model at all? Can I return a ViewData from the controller method, pop open the dialog and fill it with data?
Should the controller method return a PartialViewResult or just an ActionResult? Let's say the details view are details of a part number or something and I want to show a bunch of data elements for the part. Does this have to me a model? I am confused and any help would be greatly appreciated.
Thanks guys. Do you still use the common:
[HttpGet]
public PartialViewResult SelectedItem (string itemId)
{
// gather data for the item
return PartialView(itemModel);
}
And you are saying that the itemModel does not have to be part of the item list model?
I have a dropdown list that serves as a record navigation control -- selecting a value from the dropdown is supposed to "jump to" that record. I feel like I've done stuff like this before that worked, but I can't get this one to work. The issue seems to be that I can't get the dropdown list to change the ID route value that the page was initially called with. So let's say my page is called from this URL:
/PatientProfile/Services/12
12 is the ID route value here--this is essentially the initial record displayed. This works. However, when I select something from my dropdown, it will redirect to something like this:
/PatientProfile/Services/12?ID=7
Notice how the 12 is still there in the route value ID. ID 7 was selected from the dropdown, but it's appended to the URL as a new parameter instead of the route value. What I want to happen is this:
/PatientProfile/Services/7
Here's what the razor looks like for my dropdown:
#using (Html.BeginForm("Services", "PatientProfile", FormMethod.Get))
{
#Html.Label("ID", "View Profile:")
#Html.DropDownListFor(model => model.CurrentProfile.ID, ViewBag.ProfileID as SelectList, new { onchange = "this.form.submit();" })
}
I tried both Html.DropDownList and Html.DropDownListFor, but saw no difference in behavior.
Any help greatly appreciated.
I would use jquery for this. Please confirm the generated id of the dropdownlist for this to work properly
$('#CurrentProfile_ID').change(function(){
window.location('#Url.Action("Services", "PatientProfile", new { id = "----" })'.replace("----", $('#CurrentProfile_ID :selected').val()));
});
Hopefully this helps.
PS. This sounds like a perfect situation for using a partial view that you update using an ajax call so you don't have to post back.
I use CGridView in Yii to create tables.
I would like to show my table with pagination but hide the summary text at the top, which indicates the number of page restance (Displaying 1-4 of 4 results.)
Is that possible?
thank you
Sorry for my English
There is a template option. By default it equals {summary}\n{items}\n{pager}
If you override it in your gridview config, you'l be able to remove summary section:
$this->widget(
'zii.widgets.CGridView',
array(
Your options here ...
'template' => '{items}\n{pager}',
)
);
Another option is to set the CGridView summaryText value to false
Because YII uses CListView, it also add a certain summary class CSS in the asset folder. So to combat this, simply override the css.
Add this to your CSS.
#yw0>.summary{
display:none;
}
How to disable the inArray validator of Zend\Element\Select ?
I can not remove this standard validator select element.
Edit:
What I'm trying to do is populate a select element so dynamic with ajax. So that way the inArray loses the reference field value.
Does anyone know what is the right way to populate this element with ajax?
It actually does not look like it is possible at this point in time to disable the validator; however, you can override the select element to be able to remove the validator for this specific case:
use Zend\Form\Element\Select;
class MySelect extends Select {
public function getValidator() {
return $this->validator;
}
}
Basically the key issue with the current select element is that if the validator does not exist; it will create it. The other option you have here is to set a validator manually; which you should likely be doing is manually creating an InArrayValidator and populating it with the potential options that would be coming from your AJAX call. In which case you would need to add a setter above.
Since version 2.2, Zend Framework provide the ability to disable inArray validator calling:
$element->setDisableInArrayValidator(false);
or passing option to an element:
'disable_inarray_validator' => false