Monday, June 20, 2011

Update on jQuery Ajax ComboBox Helper. jQuery-compatible ID

Made the widget id compatible to jQuery id naming convention, all the dots are replaced with underscore. The widget name is still in object-dot-property naming form. To see things in effect from the sample code at google, I removed the DTO pattern, I used the model from ORM directly, for example, this was the DTO before:

public class ProductDto
{
    public virtual int ProductId { get; set; }
    public virtual string ProductCode { get; set; }
    public virtual string ProductName { get; set; }
    public virtual int CategoryId { get; set; }
}

But since ASP.NET MVC will not emit a property with dots using that class, we removed the DTO pattern for populating the inputs and then used the model directly(nested objects) to simulate dots conversion to underscores. ASP.NET MVC don't have problems binding the inputs to model, no matter how complex or deep the object is, and NHibernate can also use the following class(nested object) directly when saving the object that was automatically populated by ASP.NET MVC model binding:

public class Product
{
    public virtual int ProductId { get; set; }
    public virtual string ProductCode { get; set; }
    public virtual string ProductName { get; set; }
    public virtual Category Category { get; set; }
}

So if we use this kind of input...

@Html.TextBoxFor(model => model.Category.CategoryId)

...this will be the emitted html...
<input data-val="true" data-val-number="The field CategoryId must be a number." data-val-required="The CategoryId field is required." id="Category_CategoryId" name="Category.CategoryId" type="text" value="" />

...and you can access the text box's value and backing html using this:
alert($('input[name=Category.CategoryId]').val());
$('#Category_CategoryId').html('POCO YO!');

The last statement will remove the textbox and replace it with the text: POCO YO!

All the mentioned behavior above, now also applies to jQuery Ajax ComboBox, it now uses underscore for jQuery IDs, and dots for models/inputs.

This is now the new way to clear the other jQuery Ajax ComboBox's value (note the underscores( instead of dots) to access a jQuery Ajax ComboBox from jQuery):

new { on_selected = @"$('#Purchased_Product_ProductId').ajc().clearValue();" }


Get the latest changes at http://code.google.com/p/jquery-ajax-combobox-aspnet-mvc-helper/downloads/list

No comments:

Post a Comment