We Keep Coding

Disabled Kendo DropDownList in Javascript

Hi I'm trying to accomplished to disabled the KendoDropDownList via javascript.
I already did it but my problem is when I try to populate the KendoGrid the KendoDropDownList is disabled but the value is gone. Anyone know how to fix this? or Anyone know other way to do accomplished this ?
Heres my code:
<script>
$(document).ready(function () {
var url = "#Url.Action("CheckUserStatus", "Maintenance")";
var checkData = "CheckUser";
$.post(url, checkData, function (d) {
if (d != 0) {
// alert(d);
$("#office_id").data("kendoDropDownList").value(d);
document.getElementById("mode-status").innerHTML = "Update Program";
document.getElementById("button-status").innerHTML = "Update Program";
$("#grd_ApprovedBudget").data("kendoGrid").dataSource.read();
$("#office_id").kendoDropDownList({
enable: false
});
}
//alert(d);
})
});
</script>

When you call $("#office_id").kendoDropDownList, it will try to create a new instance of kendoDropDownList. If you want to disable an existing kendoDropDownList, you'll have to do it using the enable function of the existing instance:
$("#office_id").data("kendoDropDownList").enable(false);
Here's kendo documentation about the enable function.

Remove from a ComboBox a parameter in extjs 3.4

I want to remove a parameter from the store of a comboBox before it shows to the user, I know more or less how to do it but it´s not working properly, any one could give some solution? Maybe I need to select an specific event, but I tried with all the events that make sense and didn´t work, Here is the code:
var combo = fwk.ctrl.form.ComboBox({
storeConfig: {
url: app.bo.type.type_find
,fields: ['id', 'code']
}
,comboBoxConfig:{
triggerAction: 'all'
,allowBlank:false
}
});
combo.on('beforeshow', function() {
combo.store.removeAt(2);
});
Thank you very much!!!

Try removing it inside 'afterRender' event,
sample code:
listeners: {
'afterrender': function(comboRef) {
comboRef.store.removeAt(2);
}
}

Here you have the solution,
combo.getStore().load({
callback: function (r, options, success) {
if (success) {
combo.store.removeAt(2);
}
}
});
Is necessary to change it before the load of the store because first is painted the combobox and then is charged with the store data I was erasing data in a empty store.

MVVM usage with kendo ui framework

I have two views having their own view models. One of them contains just a grid and the other contains a form. I'm loading two of them dynamically at the same time.
Here is the view model of my view conatining grid:
$(function () {
var ticker = $.connection.marketWatch;
var initializationData = null; // marketWatchData
function init() {
return ticker.server.getAllMarketWatchData().done(function (data) {
initializationData = data;
$("#marketWatchGrid").data("kendoGrid").dataSource.data(data);
});
}
// Add client-side hub methods that the server will call
$.extend(ticker.client, {
updateMarketWatchData: function (marketWatchData) {
// do something...
}
});
// Start the connection
$.connection.hub.start()
.pipe(init)
.done(function () {
viewModelMarketRates.data = initializationData;
viewModelOrder.updateInstruments();
});
});
var viewModelMarketRates = kendo.observable({
data: null
});
kendo.bind($("#marketWatchGrid"), viewModelMarketRates);
And the view model of my view containing form:
$(function () {
var viewModelOrder = kendo.observable({
instruments: viewModelMarketRates.data,
selectedInstrument: "EURUSD",
amount: "0.1",
slActivate: false,
sl: "0.0",
tpActivate: false,
tp: "0.0",
buy: function () {
//e.preventDefault();
//alert("buy");
},
sell: function () {
//e.preventDefault();
//alert("sell");
},
updateInstruments: function () {
this.set("instruments", viewModelMarketRates.data);
this.set("selectedInstrument", "EURUSD");
}
});
//viewModelOrder.instruments = viewModelMarketRates.data;
//alert(viewModelOrder.instruments.length);
kendo.bind($("#orderForm"), viewModelOrder);
});
As you see I'm getting market rates data in init function and storing it in data attribute of viewModelMarketRates. I call updateInstruments function of viewModelOrder but in firebug I'm getting the following error:
ReferenceError: viewModelOrder is not defined
viewModelOrder.updateInstruments();
How can I prevent this error?

The source of your problem is that your viewModelOrder is in different scope than grid's document ready.
You shouldn't reference function/objects from multiple dynamically loaded views that load at the same time. What if one loads later than the other? Or don't load at all?
Easiest solution I can think of atm:
1. Sync the views. Load form after grid.
2. Move content of grid's document ready to a
function grid_ready(){
//all that ticker and connections start stuff
}
and use that function in form's document ready
$(function(){
//create view model etc,
grid_ready();
});
edit: grammar.

How to refresh a GridView in Extjs?

I am using a gridview which is binding data from datastore dynamically.
I have two textbox to enter data into grid.
On submit button click the textbox data I am adding to my datastore (no need to store in backend).
Now I want to refresh my gridview with datastore.
My Code:
_createEmptyRecord: function () {
var emptyrecord = Ext.data.Record.create(["id", "name", "type"]);
return new emptyrecord({
formula_id: 1,
name: Amit,
type: anything
});
},
_addValuetogrid: function () {
var record = this._createEmptyRecord();
this._store.insert(0, record);
},
_refreshgrid: function()
{
this._grid._addValuetogrid();
},
Now how to refresh my Gridview ?
Please help me...

Ext.grid.GridView has refresh() method.
this._grid.getView().refresh();

I believe a refresh function similar to this (untested) will work for Extjs 4;
_refreshgrid: function()
{
this._grid.getActiveView().refresh(true);
}

Populating a FilteringSelect datastore from an onChange event

I'm trying to bind an onChange event of one FilteringSelect to populate another FilteringSelect.
// View
dojo.addOnLoad(function () {
dojo.connect(dijit.byId('filterselect1'), 'onChange', function () {
dijit.byId('filterselect2').store = new dojo.data.ItemFileReadStore(
{ url: "/test/autocomplete/id/" + dijit.byId("filterselect1").value }
);
});
});
The JSON is generated from what I can tell correctly from a Zend Action Controller using a autoCompleteDojo helper.
// Action Controller
public function autocompleteAction()
{
$id = $this->getRequest()->getParam('id');
$select = $this->_table->select()
->from($this->_table, array('id','description'))
->where('id=?',$id);
$data = new Zend_Dojo_Data('id', $this->_table->fetchAll($select)->toArray(), 'description');
$this->_helper->autoCompleteDojo($data);
}
I receive the JSON from the remote datastore correctly, but it does not populate the second FilteringSelect. Is there something else I need to do to push the JSON onto the FilteringSelect?

I couldn't believe this was causing the problem, but the whole issue boiled down to the fact that it appears that a dojo ItemFileReadStore REQUIRES the label property of the JSON to be "name". In the end this is all that it required to wire them together.
dojo.addOnLoad(function () {
dijit.byId('filtering_select_2').store = new dojo.data.ItemFileReadStore({url: '/site/url'});
dojo.connect(dijit.byId('filtering_select_1'), 'onChange', function (val) {
dijit.byId('filtering_select_2').query.property_1 = val || "*";
});
});
UPDATE: The property within Zend form has been fixed as of ZF 1.8.4

Try console.log() in the event to see if it is launched. Changing the store should work, however for other widgets like grid you have also to call refreshing methods.