What's New?

[CLOSED] Grid Pin editor with drop down box

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    May 21, 2013, 9:13 AM

    [CLOSED] Grid Pin editor with drop down box

    Hi,

    I am facing one weird issue like when I am trying to modify any drop down column means in that I am not able to see selected drop down item name once after I clicked the pin editor. Below I mentioned reproducible sample.

    Thanks in advance. 

    
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace UAT28942.Models
{
    public class JobOrderDeliverableExtension
    {
        #region Public Properties

        public string RowId { get; set; }        
        public string DeliverableName { get; set; }        
        public int TurnAroundTypeId { get; set; }
        public string TurnAroundTypeName { get; set; }        

        #endregion
    }
}
    
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using UAT28942.Models;
using Ext.Net.Utilities;
using System.Web.Mvc;

namespace UAT28942.ReUsable
{
    public class AjaxDataHelperController : Controller
    {
        public AjaxStoreResult GetAllTurnAroundTypes()
        {

            try
            {
                List<object> data = new List<object>();

                for (int i = 0; i < 10; i++)
                {
                    data.Add
                        (
                        new
                        {
                            Id = i,
                            Name = string.Format("{0} - {1}", "Turn Around", i.ToString())
                        }
                        );
                }

                return new AjaxStoreResult(data);

            }
            catch (Exception ex)
            {
                throw ex;
            }
        }

        public AjaxStoreResult GetDeliverables()
        {

            try
            {
                List<JobOrderDeliverableExtension> _list = new List<JobOrderDeliverableExtension>();
                for (int i = 0; i < 10; i++)
                {
                    _list.Add(new JobOrderDeliverableExtension
                    {
                        DeliverableName = string.Format("{0} - {1}", "Deliverable", i.ToString()),
                        RowId = Guid.NewGuid().ToString(),
                        TurnAroundTypeId = i,
                        TurnAroundTypeName = string.Format("{0} - {1}", "Turn Around", i.ToString())
                    });
                }

                int total = _list.Count();

                return new AjaxStoreResult(_list, total);

            }
            catch (Exception ex)
            {
                throw ex;
            }
        }
    }
}
    
@using Ext.Net;
@using Ext.Net.MVC;
@{
    ViewBag.Title = "Deliverable";
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link type="text/css" rel="stylesheet" href="http://speed.ext.net/www/intro/css/main.css" />
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script type="text/javascript">

        function createUUID() {
            var s = [];
            var hexDigits = "0123456789abcdef";
            for (var i = 0; i < 36; i++) {
                s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
            }
            s[14] = "4";  // bits 12-15 of the time_hi_and_version field to 0010
            s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);  // bits 6-7 of the clock_seq_hi_and_reserved to 01
            s[8] = s[13] = s[18] = s[23] = "-";

            var uuid = s.join("");
            return uuid;
        }

        function hashCode(str) {
            try {
                var hash = 1315423911;
                for (var i = 0; i < str.length; i++) {
                    hash ^= ((hash << 5) + str.charCodeAt(i) + (hash >> 2));
                }
                return (hash & 0x7FFFFFFF);
            } catch (e) {

            }
        }

        var GenerateHashCode = function (value, record) {
            try {
                if (value != null && value != undefined && value != "" && value.length > 0) {
                    return hashCode(value);
                }
                else {
                    return hashCode(createUUID());
                }
            } catch (e) {
                Ext.Msg.alert('Error', e.message);
            }
        };

        var pinEditors = function (btn, pressed) {
            var columnConfig = btn.column,
                column = columnConfig.column;

            if (pressed) {
                column.pinOverComponent();
                column.showComponent(columnConfig.record, true);
            } else {
                column.unpinOverComponent();
                column.hideComponent(true);
            }
        };

        var turnAroundRendererelecdel = function (value) {
            try {

                var comboName = "";

                if (App.turnAroundStoreelecdel != undefined && App.turnAroundStoreelecdel.data != undefined
                    && App.turnAroundStoreelecdel.data.items.length > 0) {
                    var result = $.grep(App.turnAroundStoreelecdel.data.items, function (e) { return e.data.Id == parseInt(value); });
                    if (result != null && result != undefined && result.length > 0) {
                        comboName = result[0].data.Name;
                    }
                }
                else if (App.electronicdel != undefined && App.electronicdel.data != undefined
                        && App.electronicdel.data.items.length > 0) {
                    var result = $.grep(App.electronicdel.data.items,
                function (e) { return e.data.TurnAroundTypeId == parseInt(value); });
                    if (result != null && result != undefined && result.length > 0) {
                        comboName = result[0].data.TurnAroundTypeName;
                    }
                }

                return comboName;

            } catch (e) {

            }
        }

    </script>
</head>
<body>
    @(Html.X().ResourceManager())
    @(
 Html.X().GridPanel()
.EmptyText("No Electronic Deliverable(s) selected")
.Title("Electronic Deliverable(s)")
.Layout(LayoutType.Fit)
.ID("GridElectDeliverable")
.AutoRender(false)
.Border(true)
.Store(storeitem =>
{
    storeitem.Add(
    Html.X().Store()
    .ID("electronicdel")
    .IsPagingStore(false)
    .AutoLoad(true)
    .RemoteSort(false)
    .RemotePaging(false)
    .Proxy(proxy => proxy.Add(Html.X().AjaxProxy()
    .Url(Url.Content("~/AjaxDataHelper/GetDeliverables/"))
    .Reader(reader => reader.Add(Html.X().JsonReader()
    .Root("data")
    ))
    ))
    .Model(model => model.Add(Html.X().Model()

    .IDProperty("RowId")
    .Fields(fields =>
    {
        fields.Add(Html.X().ModelField().Name("RowId").Convert(extconvert =>
        {
            extconvert.Fn = "GenerateHashCode";
        }));
        fields.Add(Html.X().ModelField().Name("DeliverableName"));
        fields.Add(Html.X().ModelField().Name("TurnAroundTypeId"));
        fields.Add(Html.X().ModelField().Name("TurnAroundTypeName"));
    })
    ))
    .Sorters(storesorters =>
    {
        storesorters.Add(
        Html.X().DataSorter()
        .Property("DeliverableName")
        .Direction(Ext.Net.SortDirection.ASC)
        );
    })
    );
})
.ColumnModel(
Html.X().Column()
.Text("Item Name")
.DataIndex("DeliverableName")
.Sortable(true)
.Flex(1)
.MenuDisabled(true),

Html.X().ComponentColumn()
.OverOnly(true)
.Editor(true)
.Pin(true)
.Text("Turn Around")
.DataIndex("TurnAroundTypeId")
.Width(200)
.Sortable(true)
.PinEvents("expand")
.UnpinEvents("collapse")
.Renderer(new Ext.Net.Renderer
{
    Fn = "turnAroundRendererelecdel"
})
.MenuDisabled(true)
.Component(extcomponent =>
{
    extcomponent.Add(
    Html.X().ComboBox()
    .TypeAhead(true)
    .QueryMode(DataLoadMode.Local)
    .ForceSelection(true)
    .TriggerAction(TriggerAction.All)
    .DisplayField("Name")
    .ValueField("Id")
    .AllowBlank(false)
    .Store(Html.X().Store().ID("turnAroundStoreelecdel")
    .AutoLoad(true)
    .Model(
    Html.X().Model()
    .IDProperty("Id")
    .Fields
    (
    new ModelField("Id", ModelFieldType.String) { Mapping = "Id" },
    new ModelField("Name", ModelFieldType.String) { Mapping = "Name" }
    )
    )
    .Proxy(Html.X().AjaxProxy()
    .Url(Url.Content("~/AjaxDataHelper/GetAllTurnAroundTypes/"))
    .Reader(Html.X().JsonReader().Root("data"))
    )
    )
    );
}),

Html.X().ComponentColumn()
.Width(25)
.PinAllColumns(false)
.AutoWidthComponent(false)
.OverOnly(true)
.Component(Html.X().Button()
.ToolTip("Pin editors")
.Icon(Icon.Pencil)
.AllowDepress(true)
.EnableToggle(true)
.Listeners(ls => ls.Toggle.Fn = "pinEditors")
)

)

)
</body>
</html>
    Last edited by Daniil; May 30, 2013 at 4:13 AM. Reason: [CLOSED]
  2. #2
    May 21, 2013, 11:07 AM
    Hi @MTSI,

    Please clarify what Ext.NET version are you using?

    Is it reproducible with the latest sources from the SVN trunk?
  3. #3
    May 22, 2013, 7:36 AM
    Quote Originally Posted by Daniil View Post
    Hi @MTSI,

    Please clarify what Ext.NET version are you using?

    Is it reproducible with the latest sources from the SVN trunk?
    Ext.Net Version - 2.2.0.41185
  4. #4
    May 22, 2013, 10:05 AM
    I don't think Ext.NET v2.2 contains the AjaxStoreResult class.

    I am getting a compiler error.
    The type or namespace name 'AjaxStoreResult' could not be found (are you missing a using directive or an assembly reference?)
  5. #5
    May 22, 2013, 1:11 PM
    Quote Originally Posted by Daniil View Post
    I don't think Ext.NET v2.2 contains the AjaxStoreResult class.

    I am getting a compiler error.
    The type or namespace name 'AjaxStoreResult' could not be found (are you missing a using directive or an assembly reference?)
    Please include these

    using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Web.Mvc;
using System.Xml.Serialization;
using Ext.Net.Utilities;
using Newtonsoft.Json;
using Ext.Net;

namespace UAT28942.ReUsable
{
    public class AjaxFormResult : ActionResult, IXObject
    {
        public AjaxFormResult() { }

        [ConfigOption]
        public string Script { get; set; }
        public bool IsUpload { get; set; }

        private bool success = true;

        [ConfigOption]
        [DefaultValue("")]
        public bool Success
        {
            get { return this.success; }
            set { this.success = value; }
        }

        private List<FieldError> errors;

        [ConfigOption(JsonMode.AlwaysArray)]
        public List<FieldError> Errors
        {
            get
            {
                if(this.errors == null)
                {
                    this.errors = new List<FieldError>();
                }

                return this.errors;
            }
        }

        private ParameterCollection extraParams;
        public ParameterCollection ExtraParams
        {
            get
            {
                if (this.extraParams == null)
                {
                    this.extraParams = new ParameterCollection();
                }

                return this.extraParams;
            }
        }

        [ConfigOption("extraParams", JsonMode.Raw)]
        [DefaultValue("")]
        protected string ExtraParamsProxy
        {
            get
            {
                if (this.ExtraParams.Count > 0)
                {
                   return ExtraParams.ToJson();
                }

                return "";
            }
        }

        public override void ExecuteResult(ControllerContext context)
        {
            if (this.IsUpload)
            {
                context.HttpContext.Response.Write("<textarea>{0}</textarea>".FormatWith(new ClientConfig().Serialize(this)));
            }
            else
            {
                CompressionUtils.GZipAndSend(new ClientConfig().Serialize(this));
            }
        }

        [XmlIgnore]
        [JsonIgnore]
        public virtual ConfigOptionsCollection ConfigOptions
        {
            get
            {
                
                var list = new ConfigOptionsCollection();
                list.Add("script", new ConfigOption("script", new SerializationOptions("script"), null, this.Script));
                list.Add("success", new ConfigOption("success", new SerializationOptions("success"), "", this.Success));
                list.Add("errors", new ConfigOption("errors", new SerializationOptions("errors", JsonMode.AlwaysArray), "", this.Errors));
                list.Add("extraParamsProxy", new ConfigOption("extraParamsProxy", new SerializationOptions("extraParams", JsonMode.Raw), "", this.ExtraParamsProxy));

                return list;
            }
        }

        /// <summary>
        /// 
        /// </summary>
        [Browsable(false)]
        [EditorBrowsable(EditorBrowsableState.Never)]
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)]
        [XmlIgnore]
        [JsonIgnore]
        public virtual ConfigOptionsExtraction ConfigOptionsExtraction
        {
            get
            {
                return ConfigOptionsExtraction.List;
            }
        }
    }

    public class FieldError: IXObject
    {
        public FieldError(string fieldID, string errorMessage)
        {
            if(string.IsNullOrEmpty(fieldID))
            {
                throw new ArgumentNullException("fieldID", "Field ID can not be empty");
            }

            if (string.IsNullOrEmpty(errorMessage))
            {
                throw new ArgumentNullException("errorMessage", "Error message can not be empty");
            }

            this.FieldID = fieldID;
            this.ErrorMessage = errorMessage;
        }

        [ConfigOption("id")]
        [DefaultValue("")]
        public string FieldID { get; set; }

        [ConfigOption("msg")]
        [DefaultValue("")]
        public string ErrorMessage { get; set; }

        [XmlIgnore]
        [JsonIgnore]
        public virtual ConfigOptionsCollection ConfigOptions
        {
            get
            {

                var list = new ConfigOptionsCollection();
                list.Add("fieldID", new ConfigOption("fieldID", new SerializationOptions("id"), null, this.FieldID));
                list.Add("errorMessage", new ConfigOption("errorMessage", new SerializationOptions("msg"), null, this.ErrorMessage));

                return list;
            }
        }

        /// <summary>
        /// 
        /// </summary>
        [Browsable(false)]
        [EditorBrowsable(EditorBrowsableState.Never)]
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)]
        [XmlIgnore]
        [JsonIgnore]
        public virtual ConfigOptionsExtraction ConfigOptionsExtraction
        {
            get
            {
                return ConfigOptionsExtraction.List;
            }
        }
    }

    public class FieldErrors : Collection<FieldError> { }
}
    
using System.Web.Mvc;
using Ext.Net;

namespace UAT28942.ReUsable
{
    public class AjaxResult : ActionResult
    {
        public AjaxResult() { }

        public AjaxResult(string script)
        {
            this.Script = script;
        }

        public AjaxResult(object result)
        {
            this.Result = result;
        }

        public string Script { get; set; }
        public object Result { get; set; }
        public string ErrorMessage { get; set; }
		public bool IsUpload { get; set; }

        private ParameterCollection extraParamsResponse;
        public ParameterCollection ExtraParamsResponse
        {
            get
            {
                if (this.extraParamsResponse == null)
                {
                    this.extraParamsResponse = new ParameterCollection();
                }

                return this.extraParamsResponse;
            }
        }

        public override void ExecuteResult(ControllerContext context)
        {
            DirectResponse response = new DirectResponse();

            response.Result = this.Result;
			response.IsUpload = this.IsUpload;

            if (!string.IsNullOrEmpty(this.ErrorMessage))
            {
                response.Success = false;
                response.ErrorMessage = this.ErrorMessage;
            }
            else
            {
                if (!string.IsNullOrEmpty(this.Script))
                {
                    response.Script = string.Concat("<string>", this.Script);
                }

                if (this.ExtraParamsResponse.Count > 0)
                {
                    response.ExtraParamsResponse = this.ExtraParamsResponse.ToJson();
                }
            }
            
            response.Return();
        }
    }

}

    
using System;
using System.Web.Mvc;
using Ext.Net;

namespace UAT28942.ReUsable
{
    public class AjaxStoreResult : ActionResult
    {
        public AjaxStoreResult() { }

        public AjaxStoreResult(object data)
        {
            this.Data = data;
        }

        public AjaxStoreResult(object data, int totalCount) : this(data)
        {
            this.Total = totalCount;
        }

        public AjaxStoreResult(StoreResponseFormat responseFormat)
        {
            this.ResponseFormat = responseFormat;
        }

        private object data;
        public object Data
        {
            get { return this.data; }
            set { this.data = value; }
        }

        private int total;
        public int Total
        {
            get { return this.total; }
            set { this.total = value; }
        }

        private StoreResponseFormat responseFormat = StoreResponseFormat.Load;
        public StoreResponseFormat ResponseFormat
        {
            get { return this.responseFormat; }
            set { this.responseFormat = value; }
        }

        private SaveStoreResponse saveResponse;
        public SaveStoreResponse SaveResponse
        {
            get
            {
                if(this.saveResponse == null)
                {
                    this.saveResponse = new SaveStoreResponse();
                }
                return this.saveResponse;
            }
        }

        public override void ExecuteResult(ControllerContext context)
        {
            switch (this.ResponseFormat)
            {
                case StoreResponseFormat.Load:
                    StoreResponseData storeResponse = new StoreResponseData();
                    storeResponse.Data = JSON.Serialize(this.Data);
                    storeResponse.Total = this.Total;
                    storeResponse.Return();
                    break;
                case StoreResponseFormat.Save:
                    Response response = new Response(true);
                    response.Success = this.SaveResponse.Success;
                    response.Message = this.SaveResponse.Message;
                    StoreResponseData saveResponse = new StoreResponseData();
                    //saveResponse.Confirmation = this.SaveResponse.ConfirmationList;
                    response.Data = saveResponse.ToString();

                    response.Return();
                    break;
                default:
                    throw new ArgumentOutOfRangeException();
            }
        }
    }

    public enum StoreResponseFormat
    {
        Load,
        Save
    }

    public class SaveStoreResponse
    {
        private bool success = true;
        private string message;

        public bool Success
        {
            get { return this.success; }
            set { this.success = value; }
        }

        public string Message
        {
            get { return this.message; }
            set { this.message = value; }
        }

        //public ConfirmationList ConfirmationList { get; set; }
    }
}
    
using System;
using System.Web.Mvc;
using Ext.Net;

namespace UAT28942.ReUsable
{
    public class RestResult : ActionResult
    {
        private bool success;
        private string msg;
        private object data;

        public bool Success
        {
            get { return success; }
            set { success = value; }
        }
        public string Message
        {
            get { return msg; }
            set { msg = value; }
        }

        public object Data
        {
            get { return data; }
            set { data = value; }
        }
        
        public override void ExecuteResult(ControllerContext context)
        {
            Response response = new Response(true);
            response.Success = this.Success;
            response.Message = this.Message;
            response.Data = JSON.Serialize(this.Data);

            response.Return();
        }
    }
}
  6. #6
    May 22, 2013, 3:32 PM
    Is it your overrides or have you taken this code from Ext.NET v2.1?

    In general, AjaxStoreResult has been renamed to StoreResult. I renamed it in your code ans was able to run the sample.

    Please do the following.

    1. Set up this for the ComponentColumn with ComboBox.
    .Listeners(events =>
{
    events.Bind.Handler = @"var store = cmp.getStore();

                            store.on('load', function () {
                                cmp.setValue(record.data[item.dataIndex]);
                            }, null, { single: true });";
    events.Bind.Single = true;
})
    or move out the Store from the ComboBox and assign it to the ComboBox via its StoreID property.

    2. Replace
    new ModelField("Id", ModelFieldType.String) { Mapping = "Id" }
    with
    new ModelField("Id", ModelFieldType.Int)
    Last edited by Daniil; May 22, 2013 at 3:36 PM.

Similar Threads

  1. [CLOSED] Grid Combo Editor - Make drop-down wider than column
    By rthiney in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 02, 2011, 3:05 PM
  2. [CLOSED] Grid to Grid Drag and Drop Questions
    By dmoore in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Feb 15, 2011, 10:43 AM
  3. [CLOSED] [1.0] Grid to Grid Drag Drop
    By MP in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Sep 22, 2010, 3:57 PM
  4. problem with BroderLayout with grid to grid drag and drop.
    By bobs in forum 1.x Help
    Replies: 2
    Last Post: Mar 11, 2009, 8:59 AM
  5. Grid to grid Drag and Drop grouping issue
    By bobs in forum 1.x Help
    Replies: 0
    Last Post: Feb 10, 2009, 7:13 AM

Posting Permissions