Nov 30, 2012, 10:21 AM
[CLOSED] Razor - ComponentColumn as Over Editor - Set default value for combo box column
Hi,
I am facing some issues while implementing below mentioned scenario.
Scenario:
1. In Editable grid Component column I am having combo box component. In that I want to select one item as default while adding rows in that grid. Grid component column Editable mode is OverOnly (true).
Issue:
1. While adding rows that combo box store load method was not triggered. So items are not populated. If I mouse over that particular row means then only store load method got triggered otherwise it won't trigger. So due to this issue I am not able to select default value for that combo box.
Below I mentioned the code sample.
Thanks in advance.
I am facing some issues while implementing below mentioned scenario.
Scenario:
1. In Editable grid Component column I am having combo box component. In that I want to select one item as default while adding rows in that grid. Grid component column Editable mode is OverOnly (true).
Issue:
1. While adding rows that combo box store load method was not triggered. So items are not populated. If I mouse over that particular row means then only store load method got triggered otherwise it won't trigger. So due to this issue I am not able to select default value for that combo box.
Below I mentioned the code sample.
public class JobWitnesses
{
public string Name { get; set; }
public int Id { get; set; }
}
public AjaxStoreResult GetWitnessesByJobId()
{
try
{
List<JobWitnesses> _list = new List<JobWitnesses>();
for (int i = 0; i < 100; i++)
{
_list.Add(new JobWitnesses
{
Id = i,
Name = string.Format("{0}_{1}", "Witness Name", i.ToString())
});
}
var list = from rec in _list
select new
{
Id = rec.Id,
Name = rec.Name
};
int total = list.ToList().Count();
return new AjaxStoreResult(list.ToList(), total);
}
catch
{
}
return new AjaxStoreResult();
}
@using Ext.Net.MVC
@using Ext.Net
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui.min.js")" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
var departmentRenderer = function (value) {
var comboName = "";
if (App.comboBoxStore != undefined && App.comboBoxStore.data != undefined
&& App.comboBoxStore.data.items.length > 0) {
$(App.comboBoxStore.data.items).each(function (i) {
if (App.comboBoxStore.data.items[i].data.Id == value) {
comboName = App.comboBoxStore.data.items[i].data.Name;
}
});
}
return comboName;
};
var submitValue = function () {
try {
var destination = App.editorfieldMapping;
var buf = [];
buf.push(App.CustomerBillingStore.createModel({
Id: 6,
JobWitnessesID: 6
}));
destination.store.add(buf);
} catch (e) {
alert(e.message);
}
};
function comboSelect() {
try {
} catch (e) {
alert(e.message);
}
}
</script>
</head>
<body>
@{
var objc = new object[]
{
};
}
@Html.X().ResourceManager()
@(
Html.X().GridPanel()
.ID("editorfieldMapping")
.TopBar(gridtopbor =>
{
gridtopbor.Add(
Html.X().Toolbar()
.ID("grdtoolbar")
.Margins("0 0 4 0")
.Items(gridtoolbatitems =>
{
gridtoolbatitems.Add(
Html.X().Button()
.ID("exportexcel")
.Listeners(listen => { listen.Click.Handler = "submitValue();"; })
.Text("Add")
.Icon(Ext.Net.Icon.Add)
);
})
);
})
.Store(storeitem =>
{
storeitem.Add(
Html.X().Store()
.ID("CustomerBillingStore")
.PageSize(1000)
.AutoLoad(true)
.DataSource(objc)
.Model(model => model.Add(Html.X().Model()
.IDProperty("Id")
.Fields(fields =>
{
fields.Add(Html.X().ModelField().Name("Id"));
fields.Add(Html.X().ModelField().Name("JobWitnessesID").Type(Ext.Net.ModelFieldType.Int));
})
))
);
})
.ColumnModel(columnmodel =>
{
columnmodel.Columns.Add(Html.X().Column()
.Text("Job ID")
.Sortable(true)
.Width(50)
.DataIndex("Id")
.Groupable(false)
);
columnmodel.Columns.Add(
Html.X().ComponentColumn()
.ID("jobwitnessid")
.Text("Combo Box")
.DataIndex("JobWitnessesID")
.OverOnly(true)
.Editor(true)
.Sortable(false)
.Draggable(false)
.MenuDisabled(true)
.PinEvents(new string[] { "expand" })
.UnpinEvents(new string[] { "collapse" })
.Renderer(new Renderer
{
Fn = "departmentRenderer"
})
.Flex(1)
.Component(extcomp =>
{
extcomp.Add(
Html.X().ComboBox()
.ID("comboItems")
.Editable(false)
.DisplayField("Name")
.ValueField("Id")
.QueryMode(DataLoadMode.Local)
.Store(storeitem =>
{
storeitem.Add(
Html.X().Store()
.ID("comboBoxStore")
.AutoLoad(true)
.Proxy(comboproxy =>
{
comboproxy.Add(
Html.X().AjaxProxy()
.Url(Url.Content("~/AjaxData/GetWitnessesByJobId/"))
.Reader(comboreader =>
{
comboreader.Add(
Html.X().JsonReader()
.Root("data")
);
})
);
})
.Model(model => model.Add(Html.X().Model()
.IDProperty("Id")
.Fields(fields =>
{
fields.Add(Html.X().ModelField().Name("Id"));
fields.Add(Html.X().ModelField().Name("Name"));
})
))
);
})
);
})
);
})
)
</body>
</html>
Thanks in advance.
Last edited by Daniil; Dec 07, 2012 at 6:45 AM.
Reason: [CLOSED]