Doing the Drag and Drop from one Grid to Another Grid made Form elements Irregular - ext.net

Hi, I am Implementing the Drag Drop functionality using the Link
http://examples.ext.net/#/DragDrop/Grid/Grid_to_Grid/
and i have implemented this on my form as when i click on One Grid
Column setting Icon that gridpanel should be hide and this
panel(ID:pnlGridDragDrop) which are containing two DragDrop grids
should be visible.
after Displaying the pnlGridDragDrop when i trying to Drag items from
first Grid to another the above Tab Design becomes disappear.
What is the Reason here.
Please find the Image i have attached and the Code in my Program is as
like below.
<ext:GridPanel ID="grdProjectsView" Width="705" Title="Projects" >
---
columns
------
<ext:ImageCommandColumn ID="imgSettings" runat="server" Text="Settings" Resizable="false">
<Commands>
<ext:ImageCommand Icon="BasketEdit" Style="text-align: center" CommandName="Settings">
</ext:ImageCommand>
</Commands>
<Listeners>
<Command Handler="#{DirectMethods}.fnDisplaySettings(record.data.ProjectID,record.data.ProjectName);" />
</Listeners>
</ext:ImageCommandColumn>
---
---
</ColumnModel>
</ext:GridPanel>
// Drag Drop Grids Panel
<ext:Panel ID="pnlProjMemberGrid" runat="server" Border="false">
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Stretch" Padding="5" />
</LayoutConfig>
<Items>
<ext:GridPanel ID="grdNonProjectEmloyeeList">
</ext:GridPanel>
<ext:GridPanel ID="grdProjectEmloyeeList">
</ext:GridPanel>
Thank you.

Need to adjust the Heights of the panels/Container

Related

How to change order of the tabs in Sales Orders page

Is there a way to change the order of the tabs in the Sales Orders page?
Disclaimer
The shown approach is just an example of how to change the order of the tabs.
Please make sure that this approach is safe for your product before using it in it.
There is no option to specify the Tab Position from Customization, Screen Editor doesn't support drag and drop of the Tabs and even if you change the order of the tabs from Edit ASPX page pressing Generate Customization Script will roll back all the changes, so the only remaining way is to play with tabs from Javascript.
If we check the DOM structure of the page we will found the following part corresponding to the tabs table:
I will use the swap function from the answer to this question and write a function for swapping Details and Taxes tabs:
function swapElements(parent,elemA,elemB){
if(!parent||parent.constructor.toString().search('HTML')===-1) return;
var children = parent.children;
if(typeof elemA!=='number' || typeof elemB!=='number' || elemA===elemB || !children[elemA] || !children[elemB]) return;
elemB = elemA<elemB ? elemB--:elemB;
var childNumb = children.length - 1;
var a = parent.removeChild(children[elemA]);
var b = parent.removeChild(children[elemB]);
append(elemB,a);
append(elemA,b);
function append(a,b){
childNumb===a ? parent.appendChild(b) : parent.insertBefore(b,children[a]);
}
}
function swapDetailsAndTaxes()
{
swapElements(document.querySelector("#"+px_all.ctl00_phG_tab.tabTable.id+ " tr"),0,1)
}
Now we need to add this Javascript to the page and set it as a startup script:
and add it under the Initialize Client Event of the DataSource
Now after the customization is published if you open Sales Orders page you will see that Taxes Tab is the first tab
Some clarification on the previous answer using PxTabItem Text and OriginalIndex="n" based on a few things that tripped me up initially.
The OriginalIndex is a Zero Based index of where the tab is BEFORE it is moved. eg for the Projects form:
Sample of Projects original Tab Order
The trick is to list the Children Key="Items" in the Order that you want to seem them - with their original zero based index as the parameter.
Best to include ALL the tabs in the correct order - after you add the code to the aspx page - the Cust Proj editor will eliminate the unnecessary ones and only leave what is needed. This is very helpful - but tricky if you don't know this..
If you don't want to include all the tags - you have to at least include the last unchanged tab before your changes.
Also PS - don't forget to add the /Page tag at the end...after adding code after the pageSource tag. ie change /> to > at the end of the existing code then add:-
Example of re-ordering for Projects...
<PXTab ID="tab" ParentId="phG_tab" TypeFullName="PX.Web.UI.PXTab">
<Children Key="Items">
<PXTabItem Text="Tasks" OriginalIndex="1" />
<PXTabItem Text="Balances" OriginalIndex="4" />
<PXTabItem Text="Cost Budget" OriginalIndex="3" />
<PXTabItem Text="Change Requests" OriginalIndex="8" />
<PXTabItem Text="Attributes" OriginalIndex="14" />
<PXTabItem Text="Compliance" OriginalIndex="17" />
<PXTabItem Text="Contacts" OriginalIndex="19" />
<PXTabItem Text="Lien Waiver Settings" OriginalIndex="18" />
<PXTabItem Text="Activity History" OriginalIndex="10" />
<PXTabItem Text="Settings" OriginalIndex="13" />
<PXTabItem Text="Mailing Settings" OriginalIndex="16" />
<PXTabItem Text="Approval Details" OriginalIndex="15" />
<PXTabItem Text="Equipment" OriginalIndex="12" />
<PXTabItem Text="Union Locals" OriginalIndex="9" />
<PXTabItem Text="Estimates" OriginalIndex="21" />
<PXTabItem Text="Production Orders" OriginalIndex="20" />
</Children>
</PXTab>
Noticed this is an old question with an answer but just wanted to update/add another alternative to change the order of the tabs via Customization Editor Tool, see below:
-Make sure you add your screen to the Screen section of the Customization Project.
-Then Click on File->Edit Project Items, see below:
-Then select/highlight the screen for which you want to change the tab order.
-Then once selected on the bottom part edit the page by adding a PXTab tag piece of code (snippet) to change order of tabs, see below:
<Page path="~/pages/so/so301000.aspx" pageSource="YOURPAGESOURCE">
<PXTab ID="tab" ParentId="phG_tab" TypeFullName="PX.Web.UI.PXTab">
<Children Key="Items" >
<PXTabItem Text="Document Details" OriginalIndex="3" />
<PXTabItem Text="Financial Settings" OriginalIndex="2" />
<PXTabItem Text="Commissions" OriginalIndex="1" />
</Children>
</PXTab>
-Publish your Customization, and Refresh your browser with Ctrl + F5 (Windows). See results below:
Hope this helps.

Acumatica Add a tool tip for text box control

Is there a way in Acumatica to add a tool tip to a text box control on a form?
For example I would like to display a tool tip when the user hovers over the tax code control. Tax Code: [ 1099 ].
For example with usage of ToolTip. Take a look:
<px:PXDropDown ID="edStatus" runat="server" AllowNull="False" DataField="Status" Enabled="False" ToolTip="Some status" ></px:PXDropDown>
Or exactly your tool tip:
<px:PXDropDown ID="edStatus" runat="server" AllowNull="False" DataField="Status" Enabled="False" ToolTip="Tax Code: [ 1099 ]" ></px:PXDropDown>

How to make ext.net RadioGroup a required field?

We are using ext.net. I know how to make a textbox a required field, but am having trouble to force our user to make a selection on the radio group or a check box group. I know someone just assign a default value to one of the radio button, but our customer wants to leave them unchecked in the beginning but forces the web users to make a choice, which is understandable.
It appears IndicatorText and AllowBlank properties are not effective even though they are listed in the IntelliSense.
<ext:RadioGroup ID="rdGrpGender" runat="server"
ItemCls="x-check-group-base" FieldLabel="Gender"
ColumnsWidths="60,60"
IndicatorText="*" IndicatorCls="cssIndicator" AllowBlank="false">
<Items>
<ext:Radio ID="rdoMale" runat="server" BoxLabel="M" />
<ext:Radio ID="rdoFemale" runat="server" BoxLabel="F" />
</Items>
</ext:RadioGroup>
Can any expert help me out? Thanks a lot.
you can validate it like this
<ext:Button ID="Button1" runat="server" Text="Validate"><Listeners><Click Handler="#{rdGrpGender}.validate();" /></Listeners></ext:Button>

Ext.net 2.0 ComboBox, tiny bug

I have a very tricky issue which bothered me really long..
I was trying to use Ext.net 2.0 combobox to display options from remote DB. Everything works fine, but there is only one issue, when the page first loaded, if I do not change a selection of the combo, in c#, the combobox.value equals to the text instead of id.
Database is very easy: 'Test_table' has two columns, one called Tid, the other is TextContent.
My frontend code:
<ext:ComboBox ID="TestCombo" runat="server" Editable="false" DisplayField="TextContent"
ValueField="Tid" TypeAhead="true" AllowBlank="false" EmptyText="Select a text
id..." SelectOnFocus="true" FieldLabel="test text">
<Store>
<ext:Store ID="TestStore" runat="server" AutoLoad="true" AutoDataBind="true"
OnReadData="testStore_RefreshData">
<Proxy>
<ext:PageProxy>
</ext:PageProxy>
</Proxy>
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="Tid">
<Fields>
<ext:ModelField Name="Tid" />
<ext:ModelField Name="TextContent" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>
After click a save button, I try to add breakpoint to get var _M = TestCombo.value However, it appears that if I click save after I changed the selection of the combobox, _M's value will be correct(equals to Tid value), otherwise, _M's value will be the TextContent..
Anyone has idea what caused this issue? Or does anyone have some good samples for Ext.net 2.0+ combobox code (read from remote db)?

Exporting Gridview to Excel in web app

Hopefully you guys can help me out. I tried a lot of different things and cant get this working.
I have a gridview as below in a update panel:
<asp:UpdatePanel ID="udpReport" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:GridView runat="server" ID="preferenceReportGrd" AutoGenerateColumns="false"
AutoGenerateSelectButton="false" CaptionAlign="Top" EnableSortingAndPagingCallbacks="false" HorizontalAlign="left" CssSelectorClass="gvwPrefReport">
<Columns>
<asp:BoundField ReadOnly="true" DataField="ClientName" HeaderText="Company Name" />
<asp:BoundField ReadOnly="true" DataField="typeDescription" HeaderText="Preference" />
<asp:BoundField ReadOnly="true" DataField="defaultValue" HeaderText="Default Preference" />
<asp:BoundField ReadOnly="true" DataField="previousPreferenceValue" HeaderText="Previous Preference" />
<asp:BoundField ReadOnly="true" DataField="selectedValue" HeaderText="New Preference" />
<asp:BoundField ReadOnly="true" DataField="lastUpdated" HeaderText="Date Last Edited" />
</Columns>
</asp:GridView>
<div>
<user:MsgLine runat="server" ID="MsgLine1" />
</div>
</ContentTemplate>
</asp:UpdatePanel>
I am trying to export this gridview out to excel. There is a button which the user clicks on it calls the on_click method for that button and in this on_click i have the following:
string attachment = "attachment; filename=Employee.xls";
Response.AddHeader("content-disposition", attachment);
Response.ContentType = "application/excel";
StringWriter stw = new StringWriter();
HtmlTextWriter htextw = new HtmlTextWriter(stw);
preferenceReportGrd.RenderControl(htextw);
Response.Write(stw.ToString());
Response.End();
I get nothing from this tried debugging it seems that when i mouse over stw.tostring() all the values for the gridview are there but nothing gets written out.
Yes. within the update panel tag excel export is not working. I face the same problem.
To solve this use the following code in end of the update panel tag
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="BtnExport" />
</Triggers>
</asp:UpdatePanel>
it works even within the update panel also
If the GridView and/or the button is within in update panel with an async postback, I do not believe you can change the response headers or information. Try running it again with a full postback on the button trigger and see what happens. Your code did not look incorrect, but I've not tried it...
Take a look at this samples...
1. c-sharpcorner
2. Matt Berseth
3. Code Project
Check your content types and for a PostBackTrigger on the exporting button.
For Excel 2003
Response.ContentType = "application/vnd.ms-excel
For Excel 2007
Response.ContentType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
You can check out this blog post for the source of my content types.
EDIT: From your comments:
You need to set a PostBackTrigger on the panel that contains the button doing the export, not the panel that contains the GridView.
EDIT EDIT: Your file-is-not-what-it-says-it-is error is due to a feature called Extension Hardening, present in Excel 2007. Check this StackOverflow question for more info; I linked to a blog post describing the reasoning for this error and a possible workaround.
The way I was able to work around this in a simple page that I was working on was to have a hidden gridview outside of the updatepanel and set it equal to the gridview in the update panel so that they are the same (except for the new one being hidden). Then export this hidden grid to Excel the same way that you were doing it before.
One issue with doing it this way is that the export hyperlink needs to be outside of the update panel as well which means that you might not be able to put the export hyperlink where you want it.
Granted this is probably not the best way to do it, it got me around this issue at the time. Hope it helps.

Resources