PDA

View Full Version : [CLOSED] Edit combobox



luiz
Mar 14, 2014, 7:54 PM
Hi,

I have a combobox that uses handler. Related to this (http://forums.ext.net/showthread.php?29401-Filter-a-combobox-from-selected-value-other-combobox)post.

I cannot retrieve the ValueField selected in edit.

Steps to test

1? Test (this is ideal result for me)

1 - Type b
2 - Select first iten Blog 1
3 - Click on save button

Result = 1

2? Test (return displayfield)

1 - set ForceSelection="false"
2 - click on edit button
3 - click on save button

Result = Blog 1

3? Test

1 - set ForceSelection="true"
2 - click on edit button
3 - click on save button

Result = Empty

What I need

The property ForceSelection="true". Retrieve the ValueField.

My complete sample:

Class


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

namespace UploadBigFile
{
public class Blog
{
public int Id { get; set; }
public string Name { get; set; }

public static List<Blog> GetBlogs(string query)
{
return new List<Blog>()
{
new Blog(){Id=1, Name="Blog 1"},
new Blog(){Id=2, Name="Blog 2"},
new Blog(){Id=3, Name="Blog 3"}
}
.Where(a => a.Name.ToLower().StartsWith(query.ToLower()))
.ToList();
}
}
}


Hanlder

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

namespace UploadBigFile
{
/// <summary>
/// Summary description for BlogsHandler
/// </summary>
public class BlogsHandler : IHttpHandler
{


public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/json";

string query = string.Empty;

if (!string.IsNullOrEmpty(context.Request["query"]))
{
query = context.Request["query"];
}

List<Blog> blogs = Blog.GetBlogs(query);

context.Response.Write(string.Format("{{total:{1},'blogs':{0}}}", JSON.Serialize(blogs), blogs.Count));
}

public bool IsReusable
{
get
{
return false;
}
}
}
}

User Control


namespace Tests
{
public partial class UCBlog : System.Web.UI.UserControl
{
public string TextPost
{
get
{
return this.ComboBoxBlogs.Text;
}
set
{
this.ComboBoxBlogs.Text = value;
}
}
}
}

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UCBlog.ascx.cs" Inherits="Tests.UCBlog" %>

<ext:ComboBox ID="ComboBoxBlogs"
runat="server"
DisplayField="Name"
FieldLabel="Blogs"
ValueField="Id"
TypeAhead="false"
ForceSelection="true"
Width="300"
PageSize="10"
HideBaseTrigger="true"
MinChars="0"
TriggerAction="Query">
<ListConfig LoadingText="Searching...">
<ItemTpl ID="ItemTpl1" runat="server">
<Html>
<div class="search-item">
<h3><span>{Name}</span>
</div>
</Html>
</ItemTpl>
</ListConfig>
<Store>
<ext:Store ID="Store1" runat="server" AutoLoad="false">
<Proxy>
<ext:AjaxProxy Url="BlogsHandler.ashx">
<ActionMethods Read="POST" />
<Reader>
<ext:JsonReader Root="blogs" TotalProperty="total" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="Id" />
<ext:ModelField Name="Name" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>



Page


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ComboboxEdit.aspx.cs" Inherits="Tests.ComboboxEdit" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Register Src="~/UCBlog.ascx" TagName="Blogs" TagPrefix="ucb" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>

<script runat="server">
protected void ButtonSave_Click(object sender, DirectEventArgs e)
{
X.Msg.Show(new MessageBoxConfig
{
Message = this.ucBlogs.TextPost
});
}

protected void ButtonEdit_Click(object sender, DirectEventArgs e)
{
this.ucBlogs.TextPost = "Blog 1";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:FormPanel ID="FormPanel1" runat="server" Layout="FormLayout" Width="400">
<Items>
<ext:Container ID="Container" runat="server" Layout="FormLayout">
<Content>
<ucb:Blogs ID="ucBlogs" runat="server" />
</Content>
</ext:Container>
</Items>
<Buttons>
<ext:Button ID="ButtonSave" runat="server" Icon="DiskBlack" Text="Save">
<DirectEvents>
<Click OnEvent="ButtonSave_Click">
<EventMask ShowMask="true" />
</Click>
</DirectEvents>
</ext:Button>

<ext:Button ID="ButtonEdit" runat="server" Icon="ApplicationEdit" Text="Edit">
<DirectEvents>
<Click OnEvent="ButtonEdit_Click">
<EventMask ShowMask="true" />
</Click>
</DirectEvents>
</ext:Button>
</Buttons>
</ext:FormPanel>
</form>
</body>
</html>

Daniil
Mar 17, 2014, 6:35 AM
Hi @luiz,

When you set a ComboBox's Text

this.ucBlogs.TextPost = "Blog 1";
that ComboBox has no idea what "Id" is associated to that "Blog 1" Name.

I can suggest the following solution.

1. AutoLoad="true" for the Store.

2. A new method for a ComboBox. Please place the script into the page's <head>.

Ext.define("MyOverrides", {
override: "Ext.form.field.ComboBox",

setValueByDisplay: function(value) {
var record = this.findRecordByDisplay(value);

if (record) {
this.setValue(record.data[this.valueField]);
} else {
this.setValue(null);
}
}
});

3. It is how you can use that new setValueByDisplay method.

public string TextPost
{
...
set
{
this.ComboBoxBlogs.Call("setValueByDisplay", value);
}
}

luiz
Mar 20, 2014, 1:14 AM
Hi Daniil,

This method could be included in ext.net ;).

Thanks for your help. Please, close this thread!

Daniil
Mar 20, 2014, 5:00 AM
Thank you for the suggestion! We will think about that.