Extract text based on previous and next sibling - xpath

I'm trying to extract data from the following structure:
<span>Heading</span>
<br />
<br />
<span>Heading1</span>
<br />
data#1
<br />
<br />
<span>Heading4</span><br />
• data#4.1
<br />
• data#4.2
<br />
• data#4.3
<br />
• data#4.4
<br />
<br />
<span>Heading5</span>
<br />
• data#5.1
<br />
• data#5.2
<br />
• data#5.3
<br />
<br />
I can extract data#1 using something like this:
span[text()='Heading1']/following-sibling::br[1]/following::text()[1]
But I cant figure out how to extract the data under Heading4. I need to extract data#4.1, data#4.2, data#4.3 & data#4.4.
The number of points is not fixed and can vary.

This XPath 1.0 expression selects exactly the wanted nodes:
/*/span[.='Heading4']
/following-sibling::text()
[count(.|/*/span[.='Heading5']/preceding-sibling::text())
=
count(/*/span[.='Heading5']/preceding-sibling::text())
]
[normalize-space()]
It is produced from the well-known Kayessian method for intersection of two nodesets $ns1 and $ns2:
$ns1[count(.|$ns2) = count($ns2)]
We obtain the first expression above if in the Kayessian formula we substitute $ns1 with:
/*/span[.='Heading4']/following-sibling::text()
and $ns2 with:
/*/span[.='Heading5']/preceding-sibling::text()
The final predicate [normalize-space()] filters out the whitespace-only text nodes from this intersection.
XSLT-based verification:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output omit-xml-declaration="yes" indent="yes"/>
<xsl:template match="/">
<xsl:copy-of select=
"/*/span[.='Heading4']
/following-sibling::text()
[count(.|/*/span[.='Heading5']/preceding-sibling::text())
=
count(/*/span[.='Heading5']/preceding-sibling::text())
]
[normalize-space()]
"/>
</xsl:template>
</xsl:stylesheet>
When this transformation is applied on the provided XML document (with the entities replaced -- as we don't have a DTD defining them available and this isn't essential here):
<html>
<span>Heading</span>
<br />
<br />
<span>Heading1</span>
<br /> data#1
<br />
<br />
<span>Heading4</span>
<br /> #acirc;#euro;#cent; data#4.1
<br /> #acirc;#euro;#cent; data#4.2
<br /> #acirc;#euro;#cent; data#4.3
<br /> #acirc;#euro;#cent; data#4.4
<br />
<br />
<span>Heading5</span>
<br /> #acirc;#euro;#cent; data#5.1
<br /> #acirc;#euro;#cent; data#5.2
<br /> #acirc;#euro;#cent; data#5.3
<br />
<br />
</html>
the Xpath expression is evaluated and the result of this evaluation is copied to the output:
#acirc;#euro;#cent; data#4.1
#acirc;#euro;#cent; data#4.2
#acirc;#euro;#cent; data#4.3
#acirc;#euro;#cent; data#4.4

You can use
span[text()='Heading4']/following-sibling::text()[. != ""]
to get all the text after Heading4 and then use.
span[text()='Heading5']/following-sibling::text()[. != ""]
to get the text after Heading5 that you don't want, and then subtract the second result set from the first in your main program.
And if you have XPath 2, you can exclude them directly with the except operator:
span[text()='Heading4']/following-sibling::text()[. != ""] except span[text()='Heading5']/following::text()[. != ""]
You can get only the data without the • before with the substring(.,5) function, so the final XPath 2 expression becomes:
(span[text()='Heading4']/following-sibling::text()[. != ""] except span[text()='Heading5']/following::text()[. != ""])/substring(., 5)
And since you haven't explicitly said your language requirement you might also want to look at my pascal based query language, because it is imho way much nicer:
<span>Heading4</span><br />
<t:loop>
{filter(text(), "data.*")}<br/>
</t:loop>
<br/>
<span>Heading5</span><br />

I finally ended up using this, with help from the answer here
//text()[preceding-sibling::span[1] = 'Heading4']

I'd use
span[text()='Heading4']/following-sibling::text()
and then parse resulting text separately.

Related

Find the first node with a specific attribute value

<document>
<para>
<heading id="1" type="new" level="1" />
<span />
<heading id="2" type="new" level="2" />
<span />
</para>
<para>
<heading id="3" type="new" level="1" />
<span />
<heading id="4" type="new" level="2" />
<span />
</para>
<para>
<heading id="5" type="old" level="2" />
<span />
</para>
<para>
<heading id="6" type="old" level="2" />
<span />
</para>
<para>
<heading id="7" type="old" level="2" />
<span />
</para>
<para>
<heading id="8" type="old" level="2" />
<span />
</para>
<para>
<span />
</para>
</document>
Hello,
I'm parsing the above XML node-by-node in Javascript. Assuming that I'm currently at "heading id='8'" node, how would I look backwards and find the first node that has it's level set to "2" (same as the level on the node that I'm currently parsing) and type set to "new" using XPath expressions?
So, in the above exapmple, the element with id="4" must be selected.
Thanks!
You can use preceding axis and use index to return only the nearest preceding element :
preceding::*[#level='2' and #type='new'][1]
xpathtester demo
output :
<heading id="4" level="2" type="new"/>
In the demo, I use //*[#id='8'] to select element with id=8 first, to simulate context element, and then continue selecting the target element using the above mentioned XPath.
Actually I thought you wanted this.
How would I look backwards and find the first node that has it's level set to the same as the level on the node that I'm currently parsing and type set to new using XPath expressions?
Oh well, leaving this here for future reference ...
[#type='new' and #level=current()/#level]

Xquery for following-siblings, but contiguous?

I need an XPath query that originates at node 'a' to return some number of contiguously-following 'b' nodes and some number of contiguously-following 'c' nodes. So in this snippet-
<a />
<b />
<b />
<c />
<d />
<e />
<a />
<b />
<b />
<b />
<b />
<c />
it would be-
<b />
<b />
<c />
If I ran it against the first 'a' node and
<b />
<b />
<b />
<b />
<c />
If I ran it against the 2nd.
Ordering matters and I can't find a solution that does not involve unioning separate expressions.
The best bet for this is probably a recursive function something like
declare function local:successors($n as node()) as node()* {
if ($n/following-sibling::*[1][self::b|self::c])
then ($n, local-successors($n/following-sibling::*[1])
else $n
};
local:successors($a)
That's assuming you want XQuery as in your title, not XPath as in the body of your question.

Get all radcombobox client id dynamically

In Telerik Control, how to get a radcombobox id?
For example, the below code gets the value of RadCombox1 Client ID. If there is 5 radcomboboxes in my page (sample.aspx), how to get the corresponding id DYNAMICALLY.........
{
var combo = $find("<%= RadComboBox1.ClientID %>");
}
Thanks in Advance,
Ganesan A
Added More :
Thanks for your quick reply. Am using Telerik Control in c#.
a) am using no of radcombobox, raddatepicker, radtimepicker and raddatetimpicker in one page like below
<telerik:RadSplitter ID="RadSplitter1" runat="server" OnClientLoaded="OnClientLoaded">
<telerik:RadPane ID="RadPane1" runat="server">
<telerik:RadComboBox ID="RadComboBox1" CssClass="cmb_bx" runat="server">
<Items>
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem1" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem2" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem3" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem4" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem5" />
</Items>
<CollapseAnimation Duration="200" Type="OutQuint" />
</telerik:RadComboBox>
<telerik:RadComboBox ID="ComboBox" CssClass="cmb_bx" runat="server">
<Items>
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem1" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem2" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem3" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem4" />
<telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem5" />
</Items>
<CollapseAnimation Duration="200" Type="OutQuint" />
</telerik:RadComboBox>
<telerik:RadDatePicker ID="RadDatePicker1" runat="server">
</telerik:RadDatePicker>
<telerik:RadDatePicker ID="SupplierName" runat="server">
</telerik:RadDatePicker>
<telerik:RadDatePicker ID="CorporateCode" runat="server">
</telerik:RadDatePicker>
<telerik:RadDatePicker ID="PartNo" runat="server">
</telerik:RadDatePicker>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</telerik:RadPane>
<telerik:RadPane ID="RadPane2" runat="server">
</telerik:RadPane>
</telerik:RadSplitter>
b) when i scroll the page, radcombobox or any other control which i had mentioned above also scrolling with the page. it doesn't hide. So i am using the below javascript coding
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function OnClientLoaded(sender, eventArgs)
{
var pane = sender.getPaneById("<%= RadPane1.ClientID %>");
var contentElement = pane.getContentElement();
contentElement.onscroll = function () {
var combo = $find("<%= RadComboBox1.ClientID %>");
alert(combo.get_id());
var dtpkr = $find("<%= RadDatePicker1.ClientID %>");
var dropDown = combo.get_dropDownVisible();
var dropDown1 = dtpkr.isPopupVisible();
if (dropDown) {
combo.hideDropDown();
}
else if (dropDown1) {
dtpkr.togglePopup();
}
};
}
</script>
</telerik:RadCodeBlock>
c) This will hide RadcomboBox1 and RadDatePicker1 only. How can i write the code for more than one Radcombobox and Raddatepicker in one page.
Thanks
Ganesan A
You should specify what language, but this might help. This is for C#.
for (int i = 1; i < 6; i++)
{
string comboBoxName = "RadComboBox" + i.ToString();
var comboObject = (this.FindName(comboBoxName) as RadComboBox); //this returns the object if the name is found
//access the clientID
if( comboObject != null)
var clientid = comboObject.ClientID;
}
Since you already know what to do with the RadComboBoxes and RadDatePickers once you have them, I'll simply point out how to grab all the RadControls of a particular type and let you augment your code.

Spring Roo File Upload

Hy everyone!
Im trying to implement file upload with Spring roo. The files path will be persisted in the database, and the file will be saved on the file system.
According to informations found on the spring dveloper board, i modified the input.tagx and create.tagx files.(info: https://jira.springsource.org/browse/ROO-442)
input.tagx:
<jsp:root xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:fn="http://java.sun.com/jsp/jstl/functions" xmlns:spring="http://www.springframework.org/tags" xmlns:form="http://www.springframework.org/tags/form" xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0">
<jsp:output omit-xml-declaration="yes" />
<jsp:directive.attribute name="id" type="java.lang.String" required="true" rtexprvalue="true" description="The identifier for this tag (do not change!)" />
<jsp:directive.attribute name="field" type="java.lang.String" required="true" rtexprvalue="true" description="The field exposed from the form backing object" />
<jsp:directive.attribute name="label" type="java.lang.String" required="false" rtexprvalue="true" description="The label used for this field, will default to a message bundle if not supplied" />
<jsp:directive.attribute name="labelCode" type="java.lang.String" required="false" rtexprvalue="true" description="Key for label message bundle if label is not supplied" />
<jsp:directive.attribute name="required" type="java.lang.Boolean" required="false" rtexprvalue="true" description="Indicates if this field is required (default false)" />
<jsp:directive.attribute name="disabled" type="java.lang.Boolean" required="false" rtexprvalue="true" description="Specify if this field should be enabled" />
<jsp:directive.attribute name="validationRegex" type="java.lang.String" required="false" rtexprvalue="true" description="Specify regular expression to be used for the validation of the input contents" />
<jsp:directive.attribute name="validationMessageCode" type="java.lang.String" required="false" rtexprvalue="true" description="Specify the message (message property code) to be displayed if the regular expression validation fails" />
<jsp:directive.attribute name="validationMessage" type="java.lang.String" required="false" rtexprvalue="true" description="Specify the message to be displayed if the regular expression validation fails" />
<c:if test="${empty render or render}"
<c:when test="${disableFormBinding}">
<input id="_${field}_id" name="${field}" type="${type}"/>
</c:when>
<c:otherwise>
<!-- currently (spring 3.0.3), form:input doesn't support type attribute -->
<!-- <form:input id="_${field}_id" path="${field}" disabled="${disabled}"/> -->
<input id="_${field}_id" name="${field}" type="${type}"/>
<br/>
<form:errors cssClass="errors" id="_${field}_error_id" path="${field}"/>
</c:otherwise>
<c:if test="${empty disabled}">
<c:set value="false" var="disabled" />
</c:if>
<c:if test="${empty label}">
<c:if test="${empty labelCode}">
<c:set var="labelCode" value="${fn:substringAfter(id,'_')}" />
</c:if>
<spring:message code="label_${fn:toLowerCase(labelCode)}" var="label" htmlEscape="false" />
</c:if>
<c:if test="${empty validationMessage}">
<c:choose>
<c:when test="${empty validationMessageCode}">
<spring:message arguments="${fn:escapeXml(label)}" code="field_invalid" var="field_invalid" htmlEscape="false" />
</c:when>
<c:otherwise>
<spring:message arguments="${fn:escapeXml(label)}" code="${validationMessageCode}" var="field_invalid" htmlEscape="false" />
</c:otherwise>
</c:choose>
</c:if>
<c:if test="${empty required}">
<c:set value="false" var="required" />
</c:if>
<c:set var="sec_field">
<spring:escapeBody javaScriptEscape="true" >${field}</spring:escapeBody>
</c:set>
<div id="_${fn:escapeXml(id)}_id">
<label for="_${sec_field}_id">
<c:out value="${fn:escapeXml(label)}" />
:
</label>
<c:choose>
<c:when test="${disableFormBinding}">
<input id="_${sec_field}_id" name="${sec_field}" type="${fn:escapeXml(type)}" />
</c:when>
<c:otherwise>
<c:choose>
<c:when test="${type eq 'password'}">
<form:password id="_${sec_field}_id" path="${sec_field}" disabled="${disabled}" />
</c:when>
<c:otherwise>
<form:input id="_${sec_field}_id" path="${sec_field}" disabled="${disabled}" />
</c:otherwise>
</c:choose>
<br />
<form:errors cssClass="errors" id="_${sec_field}_error_id" path="${sec_field}" />
</c:otherwise>
</c:choose>
<c:choose>
<c:when test="${required}">
<spring:message code="field_required" var="field_required" htmlEscape="false" />
<spring:message argumentSeparator="," arguments="${label},(${field_required})" code="field_simple_validation" var="field_validation" htmlEscape="false" />
</c:when>
<c:otherwise>
<spring:message argumentSeparator="," arguments="${label}, " code="field_simple_validation" var="field_validation" htmlEscape="false" />
</c:otherwise>
</c:choose>
<c:set var="sec_field_validation">
<spring:escapeBody javaScriptEscape="true">${field_validation}</spring:escapeBody>
</c:set>
<c:set var="sec_field_invalid">
<spring:escapeBody javaScriptEscape="true" htmlEscape="true">${field_invalid}</spring:escapeBody>
</c:set>
<c:set var="sec_field_required">
<spring:escapeBody javaScriptEscape="true">${field_required}</spring:escapeBody>
</c:set>
<c:set var="sec_validation_regex" value="" />
<c:if test="${!empty validationRegex}">
<c:set var="sec_validation_regex" value="regExp : '${validationRegex}', " />
</c:if>
<script type="text/javascript">
Spring.addDecoration(new Spring.ElementDecoration({elementId : '_${sec_field}_id', widgetType : 'dijit.form.ValidationTextBox', widgetAttrs : {promptMessage: '${sec_field_validation}', invalidMessage: '${sec_field_invalid}', required : ${required}, ${sec_validation_regex} missingMessage : '${sec_field_required}' }}));
</script>
</div>
<br />
</c:if>
</jsp:root>
create.tagx:
<jsp:root xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:fn="http://java.sun.com/jsp/jstl/functions" xmlns:util="urn:jsptagdir:/WEB-INF/tags/util" xmlns:form="http://www.springframework.org/tags/form" xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:spring="http://www.springframework.org/tags" version="2.0">
<jsp:output omit-xml-declaration="yes"/>
<jsp:directive.attribute name="id" type="java.lang.String" required="true" rtexprvalue="true" description="The identifier for this tag (do not change!)"/>
<jsp:directive.attribute name="modelAttribute" type="java.lang.String" required="true" rtexprvalue="true" description="The name of the model attribute for form binding"/>
<jsp:directive.attribute name="path" type="java.lang.String" required="true" rtexprvalue="true" description="Specify the relative URL path (wit leading /)" />
<jsp:directive.attribute name="compositePkField" type="java.lang.String" required="false" rtexprvalue="true" description="The field name of the composite primary key (only used if a composite PK is present in the form backing object)" />
<jsp:directive.attribute name="multipart" type="java.lang.Boolean" required="false" rtexprvalue="true" description="Indicate if this is a multipart form (default: false)" />
<jsp:directive.attribute name="label" type="java.lang.String" required="false" rtexprvalue="true" description="The label used for this object, will default to a message bundle if not supplied"/>
<jsp:directive.attribute name="render" type="java.lang.Boolean" required="false" rtexprvalue="true" description="Indicate if the contents of this tag and all enclosed tags should be rendered (default 'true')" />
<jsp:directive.attribute name="openPane" type="java.lang.Boolean" required="false" rtexprvalue="true" description="Control if the title pane is opened or closed by default (default: true)"/>
<jsp:directive.attribute name="z" type="java.lang.String" required="false" description="Used for checking if element has been modified (to recalculate simply provide empty string value)"/>
<jsp:directive.attribute name="enctype" type="java.lang.String" required="false" description="Used to set the enctype, e.g. multipart/form-data for file upload support. "/>
<c:if test="${empty render or render}">
<c:if test="${empty label}">
<spring:message code="label_${fn:toLowerCase(fn:substringAfter(id,'_'))}" var="label" htmlEscape="false" />
</c:if>
<!--<c:set var="enctype" value="application/x-www-form-urlencoded"/> -->
<form:form action="${form_url}" method="POST" modelAttribute="${modelAttribute}" enctype="${enctype}">
</form:form>
<c:if test="${multipart}">
<c:set var="enctype" value="multipart/form-data"/>
</c:if>
<spring:message arguments="${label}" code="entity_create" var="title_msg" htmlEscape="false" />
<util:panel id="${id}" title="${title_msg}" openPane="${openPane}">
<spring:url value="${path}" var="form_url"/>
<c:set var="jsCall" value=""/>
<c:if test="${not empty compositePkField}">
<c:set var="jsCall" value="encodePk()" />
</c:if>
<form:form action="${form_url}" method="POST" modelAttribute="${modelAttribute}" enctype="${enctype}" onsubmit="${jsCall}">
<form:errors cssClass="errors" delimiter="<p/>"/>
<c:if test="${not empty compositePkField}">
<form:hidden id="_${fn:escapeXml(compositePkField)}_id" path="${fn:escapeXml(compositePkField)}" />
<script type="text/javascript">
<![CDATA[
dojo.require("dojox.encoding.base64");
function encodePk() {
var obj = new Object();
dojo.query("input[name^=\"${compositePkField}.\"]").forEach(function(node, index, nodelist){
obj[node.name.substring('${compositePkField}'.length + 1)] = node.value;
});
var json = dojo.toJson(obj);
var tokArr = [];
for (var i = 0; i < json.length; i++) {
tokArr.push(json.charCodeAt(i));
}
var encoded = dojox.encoding.base64.encode(tokArr);
dojo.byId('_${fn:escapeXml(compositePkField)}_id').value = encoded;
}
]]>
</script>
</c:if>
<jsp:doBody />
<div class="submit" id="${fn:escapeXml(id)}_submit">
<spring:message code="button_save" var="save_button" htmlEscape="false" />
<script type="text/javascript">Spring.addDecoration(new Spring.ValidateAllDecoration({elementId:'proceed', event:'onclick'}));</script>
<input id="proceed" type="submit" value="${fn:escapeXml(save_button)}"/>
</div>
</form:form>
</util:panel>
</c:if>
</jsp:root>
My problem is i get the fallowing error:
javax.servlet.jsp.JspTagException: Illegal use of <when>-style tag without <choose> as its direct parent
at org.apache.taglibs.standard.tag.common.core.WhenTagSupport.doStartTag(WhenTagSupport.java:95)
at org.apache.jsp.tag.web.form.fields.input_tagx._jspx_meth_c_005fwhen_005f0(input_tagx.java:519)
at org.apache.jsp.tag.web.form.fields.input_tagx.doTag(input_tagx.java:325)
at org.apache.jsp.WEB_002dINF.views.pphotoes.create_jspx._jspx_meth_field_005finput_005f0(create_jspx.java:172)
at org.apache.jsp.WEB_002dINF.views.pphotoes.create_jspx.access$2(create_jspx.java:157)
What am i doing wrong? (My controller and entity files are good i think, if needed i can post them)
Thx for any help.
cheers.
As the error message clearly states, you need to have a <c:choose> as a direct parent tag before the <c:when> tag - possibly in the following first few lines of your input.tagx file. Additionally, the <c:if> tag is not closed properly.
<c:if test="${empty render or render}"
<c:when test="${disableFormBinding}">
Cheers.

EXT.net - Grid Panel via Entity with DropDowns, Dates, Pin Editing and Deletion

Title sounds like a real mouthful, so let me try to explain this. I'm very strong with grinding out Web Forms and this is my second crack at using a framework and MVC (don't ask about the first one). Start with a table like this:
Title: Milestones
Id int - Auto, PK
Project_Id int - FK, Many Milestones to One Project, Provided static for now
Number int
Name varchar(50)
Status_Id int - FK One Status to One Milestone
PlannedDate date
LatestEstimate date
MilestoneType_ID int - FK One Type to One Milestone
These all sit on an SQL server, are pulled in by an Entity and then are pulled in by an ObjectDataSource, like this:
<asp:ObjectDataSource runat="server" ID="MilestonesObjectSource" SelectMethod="GetByProject"
DeleteMethod="DeleteMilestone" TypeName="TCProjectManagement.Models.MilestonesAddition">
<SelectParameters>
<asp:Parameter DefaultValue="6" Name="ProjectID" Type="Int32" />
</SelectParameters>
<DeleteParameters>
<asp:Parameter Type="Int32" Name="Id" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Type="Int32" Name="Id" />
<asp:Parameter Type="Int32" Name="Number" />
<asp:Parameter Type="String" Name="Name" />
<asp:Parameter Type="Int32" Name="Status_Id" />
<asp:Parameter Type="DateTime" Name="PlannedDate" />
<asp:Parameter Type="DateTime" Name="LatestEstimate" />
<asp:Parameter Type="Int32" Name="MilestoneType_ID" />
</UpdateParameters>
</asp:ObjectDataSource>
Sofar so good. Data pull seems to work out okay. I've got a couple more Object Sources that deal exclusively with the Foriegn Keys, so I'll skip those since they seem to be working.
The problems I have are attempting to stitch together many examples that don't seem to go together well. My objectives, in no paticular order:
1) Pin Editing: Click a button to edit, click it again to confirm. Rather do this than have somebody infer to double click for a change. Sofar, this sorta works.
2) Drop Downs for Foriegn Keys: While not in edit mode, should display the "Name" field of the FK. While in edit it should be a Drop Down for options (there's only three). This stays blank dispite what I do.
3) Deletion: Press a button to blow away a row. I put the button there but it's a copy of the JS for editing. What do I need to use to have it be deletion?
4) Dates: This doesn't work at all. One of the weird parts is that from the SQL server's type of Date, it gets changed to DateTime in the Entity and stays that way throughout. However, I cannot get the desired control of ext:DateField to cooperate with the provided data since it displays a time and completely blanks out when editing.. I know I'm doing something wrong here.
5) Saving Changes: Not quite sure I set it up right (or at all).
Provisions of Javascript:
<script type="text/javascript">
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 pinDeleters = function (btn, pressed) { };
</script>
And ASP Code:
<ext:GridPanel ID="MilestonesGridPanel" runat="server" Title="Milestones" Width="1000px"
Height="300px">
<Store>
<ext:Store ID="MilestonesGridStore" runat="server" DataSourceID="MilestonesObjectSource">
<Model>
<ext:Model runat="server" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" Type="Int" />
<ext:ModelField Name="Number" Type="Int" />
<ext:ModelField Name="Name" Type="String" />
<ext:ModelField Name="Status_Id" Type="Int" />
<ext:ModelField Name="PlannedDate" />
<ext:ModelField Name="LatestEstimate" />
<ext:ModelField Name="MilestoneType_ID" Type="Int" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column ID="IdColumn" runat="server" DataIndex="Id" Text="DBID" Visible="false" />
<ext:ComponentColumn ID="NumberColumn" runat="server" DataIndex="Number" OverOnly="true"
Pin="true" Flex="1" Text="Number" Editor="true">
<Component>
<ext:NumberField ID="NumberColumnNumberField" runat="server" />
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="NameColumn" runat="server" DataIndex="Name" OverOnly="true"
Pin="true" Flex="1" Text="Name" Editor="true">
<Component>
<ext:TextField ID="NameColumnTextField" runat="server" />
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="StatusColumn" runat="server" DataIndex="Status_Id" OverOnly="true"
Pin="true" Flex="1" Text="Status" Editor="true">
<Component>
<ext:ComboBox ID="StatusColumnDropDownBox" runat="server" QueryMode="Local" Editable="false"
StoreID="MilestoneStatusStore" DisplayField="Name" ValueField="ID" EmptyText="Empty" />
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="PlannedDateColumn" runat="server" DataIndex="PlannedDate"
OverOnly="true" Pin="true" Flex="1" Text="Planned Date" Editor="true">
<Renderer Format="Date" FormatArgs="'m/d/y'" />
<Component>
<ext:DateField ID="PlannedDateColumnTextField" runat="server" Format="MM/dd/yyyy"
EmptyText="Empty" />
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="LatestEstimateColumn" runat="server" DataIndex="LatestEstimate"
OverOnly="true" Pin="true" Flex="1" Text="Latest ETA" Editor="true">
<Renderer Format="Date" FormatArgs="'m/d/y'" />
<Component>
<ext:DateField ID="LatestEstimateColumnTextField" runat="server" Format="MM/dd/yyyy"
EmptyText="Empty" />
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="MilestoneTypeColumn" runat="server" DataIndex="MilestoneType_ID"
OverOnly="true" Pin="true" Flex="1" Text="Milestone Type" Editor="true">
<Component>
<ext:ComboBox ID="MilestoneTypeColumnComboBox" runat="server" QueryMode="Local" Editable="false"
StoreID="MilestoneTypesStore" DisplayField="Name" ValueField="ID" EmptyText="Empty" />
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="EditColumn" runat="server" Width="30" PinAllColumns="false"
AutoWidthComponent="false" OverOnly="true" Text="Edit" Sortable="False">
<Component>
<ext:Button ID="EditButton" runat="server" ToolTip="Pin Editors" Icon="Pencil" AllowDepress="true"
EnableToggle="true" Width="25">
<Listeners>
<Toggle Fn="pinEditors" />
</Listeners>
</ext:Button>
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="DeleteColumn" runat="server" Width="30" PinAllColumns="false"
AutoWidthComponent="false" OverOnly="true" Text="Delete" Sortable="False">
<Component>
<ext:Button ID="DeleteButton" runat="server" ToolTip="Delete Milestone" Icon="Delete"
AllowDepress="true" EnableToggle="false" Width="25">
<Listeners>
<Click Handler="#{MilestonesGridStore}.remove(this.parentMenu.dataRecord)" />
</Listeners>
</ext:Button>
</Component>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel runat="server" Mode="Single">
<Listeners>
<Select Handler="#{DeleteMilestoneGridButton}.enable();" />
<Deselect Handler="if (!#{MilestonesGridPanel}.selModel.hasSelection()) {
#{DeleteMilestoneGridButton}.disable();
}" />
</Listeners>
</ext:RowSelectionModel>
</SelectionModel>
<Buttons>
<ext:Button ID="AddtoMilestoneGridButton" runat="server" Text="Insert" Icon="Add">
<Listeners>
<Click Handler="#{MilestonesGridStore}.insert(0, {}); #{MilestonesGridPanel}.editingPlugin.startEditByPosition({row:0, column:0});" />
</Listeners>
</ext:Button>
<ext:Button ID="DeleteMilestoneGridButton" runat="server" Text="Delete" Icon="Delete"
Disabled="true">
<Listeners>
<Click Handler="#{MilestonesGridPanel}.deleteSelected();
if (!#{MilestonesGridPanel}.hasSelection()) {
#{DeleteMilestoneGridButton}.disable();
}" />
</Listeners>
</ext:Button>
<ext:Button ID="RefreshMilestonesGridButton" runat="server" Text="RefresH" Icon="Reload">
<Listeners>
<Click Handler="#{MilestonesGridStore}.load();" />
</Listeners>
</ext:Button>
<ext:Button ID="SaveMilestoneGridButton" runat="server" Text="Save" Icon="Disk">
<Listeners>
<Click Handler="#{MilestonesGridStore}.sync();" />
</Listeners>
</ext:Button>
</Buttons>
</ext:GridPanel>

Resources