Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
140
Regarding combo box property
posted

When I am selecting value in a combo box it is working properly. After the selection, when I move my cursor on the selected text of the combo box, the text is not remaining constant  that is text is not displaying. when I move out the cursor from the combo box again the text is displaying. can you please sort out this problem for me. Here I am sending you the code which I have used.

<style type="text/css">

input.button-style {

margin-top: 10px;

}

.ui-iggrid th, .ui-iggrid th.ui-state-default, .ui-iggrid th.ui-state-hover, .ui-iggrid th.ui-state-active {

text-align: left;

white-space: pre-wrap;

}

div#layout {

background-color: #777;

padding: 15px;

border-radius: 5px;

/*border-top-left-radius: 5px;

border-top-right-radius: 5px;

border-bottom-left-radius: 5px;

border-bottom-right-radius: 5px;*/

}

div#layout .left p, div#layout .right p, div#layout .center p, div#layout h3 {

margin: 15px;

}

div#layout .center {

background-color: #EEE;

color: #555;

}

div#layout .right {

background-color: #555;

color: #EEE;

border-radius: 5px;

}

div#layout .left {

padding-left: 20px;

background-color: #EEE;

border-radius: 10px;

}

div#layout .header {

background-color: #2CBDF9;

}

div#layout .footer {

background-color: #2CBDF9;

}

.hidden {

display: none !important;

}

.ui-datepicker {

width: 360px;

}

</style>

}

@section Body {

<h2>@ViewBag.Title</h2>

<script>

currencies = @Html.Raw(Json.Encode(Model.Currencies));

components = @Html.Raw(Json.Encode(Model.Components));

function formatCurrency(val) {

var i, item;

for (i = 0; i < currencies.length; i++) {

item = currencies[i];

if (item.Id === val) {

val = item.CurrencyCode;

}

}

return val;

}

function formatComponent(val) {

var i, item;

for (i = 0; i < components.length; i++) {

item = components[i];

if (item.Id === val) {

val = item.SumitomoPartNumber;

}

}

return val;

}

</script>

<fieldset>

<div id="layout" style="width: 100%; height: 760px; display: block">

<div id="livepricereportdiv" class="left" style="width: 100%">

<br />

@using (Html.BeginForm("ExportToExcel", "CspModule", FormMethod.Post))

{

<table>

<tr>

<td><h4> Customer</h4></td>

<td>&nbsp;&nbsp;

@(Html.Infragistics().ComboFor(m => m.CustomerItem)

.ID("customerCombo")

.Width("270px")

.DataSource(Model.Customers)

.ValueKey("Id")

.TextKey("CustomerName")

.NullText("Select a Customer")

//.ValidatorOptions(options => options.OnBlur(false).OnChange(false).OnSubmit(true).BodyAsParent(false))

.DataBind()

.Render()

)

</td>

</tr>

<tr>

<td>

<h4> Project</h4>

</td>

<td>

@(Html.Infragistics().ComboFor(m => m.ProjectItem)

.ID("projectCombo")

.Width("270px")

.DataSource(Model.Projects)

.ValueKey("Id")

.TextKey("ProjectCode")

.NullText("Select a Project")

//.ValidatorOptions(options => options.OnBlur(false).OnChange(false).OnSubmit(true).BodyAsParent(false))

.DataBind()

.Render()

)

</td>

</tr>

</table>

<br />

@*<legend>Export Format</legend>

<input type="radio" id="CurrentPage" name="exportType" value="false" checked="checked" />

<label for="CurrentPage">Current Page</label>

<input type="radio" id="AllPages" name="exportType" value="true">

<label for="AllPages">All Pages</label>*@

<input type="submit" id="exportsubmit" value="Export To Excel" />

}

<br /><br />

</div>

 

<br />

<div id="LivePricesGrid">

@(Html.Infragistics().Grid(Model.ComponentSalesPrices.AsQueryable())

.ID("LivePricesGrid")

.Width("100%")

.Height("500px")

.PrimaryKey("Id")

.AutoGenerateColumns(false)

.AutoGenerateLayouts(false)

.RenderCheckboxes(true)

.AutoAdjustHeight(true)

.Columns(column =>

{

column.For(x => x.Id).HeaderText("Id").Hidden(true);

column.For(x => x.ComponentId).HeaderText("Component").FormatterFunction("function(val) { return formatComponent(val); }");

column.For(x => x.EffectiveStartDate).HeaderText("Effective Start Date");

column.For(x => x.EffectiveEndDate).HeaderText("Effective End Date");

column.For(x => x.CurrencyId).HeaderText("Currency").FormatterFunction("function(val) { return formatCurrency(val); }");

column.For(x => x.SellingPrice).HeaderText("Selling Price");

})

.Features(features =>

{

features.Sorting().Type(OpType.Local);

features.Paging().Type(OpType.Local);

//features.Filtering().Type(OpType.Local);

features.Selection().Mode(SelectionMode.Row);

features.Tooltips()

.Visibility(TooltipsVisibility.Always)

.ColumnSettings(cs =>

{

cs.ColumnSetting().ColumnKey("ComponentId").AllowTooltips(true);

cs.ColumnSetting().ColumnKey("EffectiveStartDate").AllowTooltips(true);

cs.ColumnSetting().ColumnKey("EffectiveEndDate").AllowTooltips(true);

cs.ColumnSetting().ColumnKey("CurrencyId").AllowTooltips(true);

cs.ColumnSetting().ColumnKey("SellingPrice").AllowTooltips(true);

})

.Style(TooltipsStyle.Tooltip)

.ShowDelay(100);

})

.DataSourceUrl(Url.Action("GetLivePricesbyCustomerIdandProjectId"))

.DataBind()

.Render()

)

<input type="hidden" name="pageSize" id="pageSize" value="" />

<input type="hidden" name="pagenumber" id="pageNumber" value="" />

</div>

</div>

</fieldset>

 

<script>

$(function () {

var grid = $("#LivePricesGrid"),

pageSize = $("#pageSize"),

pageNumber = $("#pageNumber");

pageNumber.val(0);

pageSize.val(0);

grid.on("iggridrendered", function (e, ui) {

pageSize.val(grid.igGridPaging("option", "pageSize"));

pageNumber.val(grid.igGridPaging("option", "currentPageIndex"));

});

grid.on("iggridpagingpageindexchanged", function (e, ui) {

pageNumber.val(ui.pageIndex);

});

grid.on("iggridpagingpagesizechanged", function (e, ui) {

pageSize.val(ui.pageSize);

pageNumber.val(0);

});

});

$("#exportsubmit").igButton({ labelText: $("#exportsubmit").val() });

</script>

<script>

var updates, loadingIndicator;

$(function () {

$.ui.igValidator.defaults.showAllErrorsOnSubmit = true;

$("#customerCombo").on("igcomboselectionchanged", function (e, args) {

var customerId = $("#customerCombo").igCombo("value");

var postData = { "CustomerId": customerId };

$.getJSON("/CspModule/GetProjectsbyCustomerId", postData, function (returnData) {

$("#projectCombo").igCombo("option", "dataSource", returnData);

});

});

$("#projectCombo").on("igcomboselectionchanged", function (e, args) {

var customerId = $("#customerCombo").igCombo("value");

var projectId = $("#projectCombo").igCombo("value");

var postData = { "CustomerId": customerId, "ProjectId": projectId };

$.getJSON("/CspModule/GetLivePricesbyCustomerIdandProjectId", postData, function (returnData) {

$("#LivePricesGrid").igGrid("option", "dataSource", returnData);

});

$('.validateOptions').attr('disabled', 'disabled');

});

});

</script>

}