submit whole form to webservice - ext.net

I am using webservice.I wanna sumbit my form elements to the webservice,in your example ,it is possiable send parameterrs by one by.is there any way to submit whole form and parse it and reach serverside part.
<ext:Button ID="Button1" runat="server" Text="XML WebMethod">
<Listeners>
<Click Handler="xmlService(#{txtName}.getValue());" />
</Listeners>
</ext:Button>
var xmlService = function (name) {
Ext.net.DirectMethod.request({
url : "XmlService.asmx/SayHello",
cleanRequest : true,
params : {
name : name
},
success : function (result) {
Ext.Msg.alert("Xml Message", Ext.DomQuery.selectValue("string", result, ""));
}
});
};
or using eventhandler
<ext:Button runat="server" Text="[WebMethod]">
<DirectEvents>
<Click
Url="TestService.asmx/SayHello1"
Type="Load"
Method="POST"
CleanRequest="true">
<ExtraParams>
<ext:Parameter Name="name" Value="#{txtName}.getValue()" Mode="Raw" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>

Assume there is the following form on the page.
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:TextField ID="TextField1" runat="server" />
<ext:TextField ID="TextField2" runat="server" />
</form>
A DirectMethod call with a form submit.
Ext.net.DirectMethod.request({
url : "XmlService.asmx/Submit",
formId : "form1"
});
A DirectEvent call with a form submit.
<DirectEvents>
<Click Url="XmlService.asmx/Submit" />
</DirectEvents>
A Submit WebMethod
[WebMethod]
public object Submit(string TextField1, string TextField2)
{
// some stuff
}

Related

Callback when Ext.NET Combobox local query returns no data

Using Ext.NET combobox.
<ext:ComboBox runat="server"
ID="ComboBoxCategorizedList"
QueryMode="Local"
ValueField="Id"
EmptyText="Type to begin search..."
TypeAhead="false"
DisplayField="Name"
Width="500"
NoteAlign="Down" EnableKeyEvents="true"
Note="Press 'Search' icon or Press ENTER for more results"
RemoveClearTrigger="true">
<%--Note="Type '*' for a full list"--%>
<HtmlBin>
<ext:XScript runat="server">
<script type="text/javascript">
$(window).on("__refresh__", function () {
#{ StoreComboBoxCategorizedList }.reload();
});
</script>
</ext:XScript>
</HtmlBin>
<Store>
<ext:Store runat="server" ID="StoreComboBoxCategorizedList" OnReadData="ComboBoxCategorizedList_ReadData">
<Proxy>
<ext:PageProxy />
</Proxy>
<Model>
<ext:Model Id="ModelCategorizedComboBox" runat="server" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Type" />
<ext:ModelField Name="RefId" />
<ext:ModelField Name="Description" />
</Fields>
</ext:Model>
</Model>
<Listeners>
<Update Handler="#{ComboBoxCategorizedList}.expand();" />
<EndUpdate Handler="categorizedList();" />
</Listeners>
<Parameters>
<ext:StoreParameter Mode="Raw" Name="filter" Value="#{ComboBoxCategorizedList}.getValue()" />
</Parameters>
</ext:Store>
</Store>
<Triggers>
<ext:FieldTrigger Icon="Clear"/>
<ext:FieldTrigger Icon="Search"></ext:FieldTrigger>
</Triggers>
<Listeners>
<SpecialKey Fn="enterKeyPressHandler" />
<Expand Handler="categorizedList();" Delay="100" />
<BeforeSelect Fn="onBeforeSelect" />
<KeyPress Handler="#{ComboBoxCategorizedList}.getTrigger(1).onClick();" Buffer="1000" />
<Change Handler="filterComboxBoxFunction(#{StoreComboBoxCategorizedList}, #{ComboBoxCategorizedList}.getValue()); #{ComboBoxCategorizedList}.expand(); categorizedList();" Delay="100" />
</Listeners>
Not asking for debugging help, but I want to know if an Ext.NET or Extjs dev has a generic solution: Very simply ... I want to initiate a remote search only when the local search returns no records. So I am looking for the best way to wire this up to the combobox. I've looked at using the Expand event and BeforeQuery event but this seems to come up short.
I'm looking for best practices so i can add a "OnLocalQuery" event to my comboboxes; and then take action if the local query returns 0 matches.
I use this function and it works fine .. and without QueryMode="Local":
<ext:ComboBox ID="cmb_name" runat="server" FieldLabel="ComboBox" EmptyText="-Select-" HideTrigger="true" TriggerAction="All" SelectOnFocus="true" DisplayField="Name" ValueField="Id" Editable="true" TabIndex="11">
<Store>
<ext:Store ID="str_ComboBox" runat="server" PageSize="10">
<Model>
<ext:Model ID="mdl_ComboBox" runat="server">
<Fields>
<ext:ModelField Name="Id" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Type" />
<ext:ModelField Name="RefId" />
<ext:ModelField Name="Description" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Listeners>
<Change Fn="fn_filter" />
</Listeners>
</ext:ComboBox>
<script type="text/javascript">
var fn_filter = function (_this, newValue, oldValue, eOpts) {
var n = 0;
if (_this.lastQuery == undefined || _this.lastQuery == null) {
_this.lastQuery = "";
}
_this.getStore().clearFilter(true);
_this.getStore().load();
_this.store.filter(function (item) {
if (item.get('Name').includes(_this.getRawValue())) {
n = n + 1;
return true;
}
else {
return false;
}
});
_this.expand();
if (n == 0) {
//returns no records
//enter code here Callback
}
}
</script>

Autentication logic form

i'm working in ext.net login form, but no idea how to implement a custom logic to take the user text field & password textfield & validate it.
here is what a had made till now.
appretiate help..
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Ext.NET Example</title>
<link type="text/css" rel="stylesheet" href="http://speed.ext.net/www/intro/css/main.css" />
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Window runat="server" Width="300" Height="200" Draggable="False" Closable="False" Icon="Lock" Title="Loging" BodyPadding="5">
<Items>
<ext:TextField runat="server" Text="Demo" FieldLabel="user" BlankText="ur name is required" AllowBlank="False" ReadOnly="False"/>
<ext:TextField runat="server" Text="password" FieldLabel="pass" BlankText="Pass required" AllowBlank="False" ReadOnly="False" />
</Items>
<Buttons>
<ext:Button runat="server" ID="buton" Icon="Accept" Text="Submit" >
<Listeners>
<Click Handler="init"></Click>
</Listeners>
</ext:Button>
</Buttons>
</ext:Window>
</form>
</body>
</html>
There's a login form with browsers 'saving' functionality (allows google chrome to ask you to "save" the password. This is a full transcript of the example which can be accessed at http://examples4.ext.net/#/Form/Login/Auto_Complete/.
<%# Page Language="C#" %>
<script runat="server">
protected void Button1_Click(object sender, DirectEventArgs e)
{
// Do some Authentication...
if (e.ExtraParams["user"] != "Ext.NET" || e.ExtraParams["pass"] != "extnet")
{
e.Success = false;
e.ErrorMessage = "Invalid username or password.";
}
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Login - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
<script>
// Invalidate the login fields with the given reason.
var invalidateLogin = function(reason) {
App.txtUsername.setValidation(reason);
App.txtPassword.setValidation(reason);
App.txtUsername.validate();
App.txtPassword.validate();
Ext.MessageBox.show({
title: 'Authentication error',
msg: reason,
buttons: Ext.MessageBox.OK,
animateTarget: 'Window1',
icon: 'Error'
});
};
var handleLogin = function() {
var form = App.Window1.el.up().dom; // Window1 is a direct child of the form element.
App.Window1.close();
// Now this would work for Chrome, and we already triggered autoComplete for IE.
// Chrome's is only triggered after the destination page is loaded.
setForm(form, "../../../Desktop/Introduction/Overview/Desktop.aspx", form.target);
form.submit();
restoreForm(form);
};
var orgFormAction, orgFormTarget,
btn = null, iframe = null;
// If we are on IE, we will create a button and click it (at once),
// so autoComplete is triggered.
var handleClientClick = function() {
var form = App.Window1.el.up().dom; // Window1 is a direct child of the form element.
if (Ext.isIE) {
if (iframe == null) {
iframe = document.createElement("IFRAME");
iframe.name = "ie_login_flush";
iframe.style.display = "none";
form.appendChild(iframe);
}
if (btn == null) {
btn = document.createElement("BUTTON");
btn.type = "submit";
btn.id = "submitButton";
btn.style.display="none";
form.appendChild(btn);
}
// On WebForms, we have to force set the form settings as we run or else we'll
// break directEvent calls.
setForm(form, "about:blank", "ie_login_flush");
btn.click();
restoreForm(form);
}
}
var setForm = function(form, action, target) {
// Back up original settings once per execution.
if (typeof orgFormAction == 'undefined') {
orgFormAction = form.action;
}
if (typeof orgFormTarget == 'undefined') {
orgFormTarget = form.target;
}
form.action = action;
form.target = target;
};
var restoreForm = function(form) {
form.action = orgFormAction;
form.target = orgFormTarget;
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<h1>Logging with browser saving functionality</h1>
<p>The valid login/password combination here would be:</p>
<p>
Username: Ext.NET<br>
Password: extnet
</p>
<p>On successful authentication, you will be redirected to the Desktop example.</p>
<ext:Window
ID="Window1"
runat="server"
Closable="false"
Resizable="false"
Height="200"
Icon="Lock"
Title="Login"
Draggable="true"
Width="350"
Modal="false"
BodyPadding="5"
Layout="Form">
<Items>
<ext:TextField
ID="txtUsername"
runat="server"
Name="username"
FieldLabel="Username"
AllowBlank="false"
BlankText="Your username is required." />
<ext:TextField
ID="txtPassword"
runat="server"
Name="password"
InputType="Password"
FieldLabel="Password"
AllowBlank="false"
BlankText="Your password is required." />
</Items>
<Buttons>
<ext:Button
ID="Button1"
runat="server"
Text="Login"
Icon="Accept"
FormBind="true"
Handler="handleClientClick">
<DirectEvents>
<Click
OnEvent="Button1_Click"
Success="handleLogin"
Failure="invalidateLogin(result.errorMessage);"
ShowWarningOnFailure="false">
<EventMask ShowMask="true" Msg="Verifying..." MinDelay="1000" />
<ExtraParams>
<ext:Parameter Name="user" Value="App.txtUsername.value" Mode="Raw" />
<ext:Parameter Name="pass" Value="App.txtPassword.value" Mode="Raw" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
</Buttons>
</ext:Window>
</form>
</body>
</html>

Render()'s Method different reactions

I have my render() method with no code.
And I have this action-method:
#ProcessAction(name = "viewBook")
public void viewBook(ActionRequest actionRequest,ActionResponse actionResponse) throws SystemException, PortalException {
long bookId = ParamUtil.getLong(actionRequest, "bookId");
Book book = BookLocalServiceUtil.getBook(bookId);
actionRequest.setAttribute(FinalStrings.BOOK_ENTRY, book);
actionResponse.setRenderParameter("jspPage", "/html/LibraryPortlet/view_book.jsp");
How can I rewrite this "GET" method into render() method? I mean I need to run
public void render(RenderRequest renderRequest, RenderResponse rendeResponse){
super.render(renderRequest, renderResponse)
}
in the default situation and
public void render(RenderRequest renderRequest, RenderResponse rendeResponse){
\\THIS CODE IS NOT WORKING, IT'S JUST TO SHOW WHAT I WANT!
long bookId = ParamUtil.getLong(actionRequest, "bookId");
Book book = BookLocalServiceUtil.getBook(bookId);
actionRequest.setAttribute(FinalStrings.BOOK_ENTRY, book);
actionResponse.setRenderParameter("jspPage", "/html/LibraryPortlet/view_book.jsp");
when I need to use viewBook() method. How can I parametrize(?) render() method?
Update:
For more details I attached one screenshot:
Meanwhile in my action.jsp:
<liferay-ui:icon-menu>
<portlet:actionURL name="deleteBook" var="deleteURL">
<portlet:param name="bookId"
value="${String.valueOf(book.getBookId())}" />
</portlet:actionURL>
<portlet:renderURL name="viewBook" var="viewURL">
<portlet:param name="bookId"
value="${String.valueOf(book.getBookId())}" />
</portlet:renderURL>
<portlet:renderURL var="editBookURL" name="viewEdit">
<portlet:param name="bookId" value="${String.valueOf(book.getBookId())}" />
</portlet:renderURL>
<liferay-ui:icon image="add" message="View" url="${viewURL.toString()}" />
<liferay-ui:icon image="add" message="Edit" url="${editBookURL.toString()}" />
<liferay-ui:icon-delete image="delete" message="Delete" url="${deleteURL.toString()}" />
In my view_book.jsp:
<%#page import="com.softwerke.FinalStrings"%>
<%#page import="com.softwerke.model.Book"%>
<%#page import="com.softwerke.service.BookLocalServiceUtil"%>
<%#page import="com.liferay.portal.kernel.util.ParamUtil"%>
<%# include file="/html/init.jsp"%>
<portlet:renderURL var="backURL">
<portlet:param name="jspPage" value="/html/view.jsp"/>
</portlet:renderURL>
<liferay-ui:header backURL="${backURL}" title="Back" />
<%
Book book = (Book) request.getAttribute(FinalStrings.BOOK_ENTRY);
%>
<aui:form>
<aui:model-context bean="${book}" model="${Book.class}" />
<aui:input name="bookName" label="Book Name" disabled="true"/>
<aui:input type="textarea" name="description" label="Description" disabled="true"/>
<aui:input name="authorName" label="Author Name" disabled="true"/>
<aui:input name="price" label="Price" disabled="true"/>
</aui:form>
According to my task I can not use Action URL here. What should I do???
You can send a command param to the render, so you can split the logic into two or more render methods, depending on the command, or maybe easier, invoke a mvcPath without the need of implementing anything in render(). Include something like this in the jsp with your list of books:
<portlet:renderURL var="myBookURL">
<portlet:param name="mvcPath" value="/view_book.jsp" />
<portlet:param name="bookId" value="<%= someBookId %>" />
</portlet:renderURL>
View My Book
You just need a view_book.jsp with something like:
<%
long bookId = ParamUtil.getLong(request, "bookId");
Book book = BookLocalServiceUtil.getBook(bookId);
%>
Hope it helps.

Update row in Gridview?

I have updated a row in Gridview but it is not working.
Here is my code :
protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
GridViewRow row = (GridViewRow)GridView1.Rows[e.RowIndex];
//Label lbldeleteid = (Label)row.FindControl("Label1");
string bname= GridView1.DataKeys[e.RowIndex].Values["manufacturer"].ToString();
TextBox tbmanu = (TextBox)GridView1.Rows[e.RowIndex].Cells[0].Controls[1];
var myString = tbmanu.ToString();
SqlCommand cmd = new SqlCommand("manu_upd",con);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.Add("#manufacturer", SqlDbType.NVarChar,100);
cmd.Parameters["#manufacturer"].Value = myString;
con.Open();
cmd.ExecuteNonQuery();
con.Close();
GridView1.EditIndex = -1;
BindData();
I got the following error :
Unable to cast object of type 'System.Web.UI.LiteralControl' to type
'System.Web.UI.WebControls.TextBox'.
here is my Grid view :
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
CellPadding="4" DataKeyNames="manufacturer" ForeColor="#333333"
GridLines="None" Width="400px" BorderStyle="Double"
CellSpacing="3" Font-Bold="True" Font-Size="Small" ShowFooter="True"
ShowHeaderWhenEmpty="True" onrowdeleting="GridView1_RowDeleting"
onrowediting="GridView1_RowEditing"
onrowupdating="GridView1_RowUpdating"
onrowcancelingedit="GridView1_RowCancelingEdit"
AutoGenerateEditButton="True">
<AlternatingRowStyle BackColor="White"/>
<Columns>
<asp:TemplateField HeaderText="Number" ItemStyle-
HorizontalAlign="Center">
<ItemTemplate>
<asp:Label ID="lbnaumber" runat="server" Text='<%#
Container.DataItemIndex + 1 %>'></asp:Label>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:TemplateField>
<asp:TemplateField HeaderText="Manufacturer"
SortExpression="manufacturer">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%#
Bind("manufacturer") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="tbmanu" runat="server" Text='<%#
Bind("manufacturer") %>'></asp:TextBox>
</EditItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<%--<asp:CommandField ShowEditButton="True" />--%>
<asp:CommandField ShowDeleteButton="True" />
</Columns>
<EditRowStyle BackColor="#2461BF"/><FooterStyle BackColor="#507CD1"
Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White"/>
<PagerStyle BackColor="#2461BF" ForeColor="White"
HorizontalAlign="Center" />
<RowStyle BackColor="#EFF3FB" /><SelectedRowStyle BackColor="#D1DDF1"
Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#F5F7FB"/>
<SortedAscendingHeaderStyle BackColor="#6D95E1" />
<SortedDescendingCellStyle BackColor="#E9EBEF" />
<SortedDescendingHeaderStyle BackColor="#4870BE" />
</asp:GridView>
When I change the index of my text box 1 to 3 it shows me below error :
Specified argument was out of the range of valid values.
Parameter name: index
When i change its index 3 to 2 it gives me below error :
Unable to cast object of type 'System.Web.UI.WebControls.DataControlLinkButton' to type 'System.Web.UI.WebControls.TextBox'.
I have one required field validator in my form but when I enable that validation update in grid view is not working.
protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
GridViewRow row = GridView1.Rows[e.RowIndex];
TextBox tbmanu1 = (TextBox)row.FindControl("tbmanu");
//or try
//TextBox tbmanu1= (TextBox)row.Cells[0].FindControl("tbmanu");
string myString = Convert.Tostring(tbmanu1.text);
cmd.Parameters["#manufacturer"].Value = myString;
}
Try wrapping your gridview in a asp:UpdatePanel and set the update mode to conditional.
Good Luck

how to use the updatepanl and postback trigger and progress templete in asp.net ajax

hi i am using update panel in my project, one page i have file upload control is there, so save the page file upload is not working that time i used post back trigger control (id is button id) now my problem is progress bar is not working , please give me any suggestion. my code is
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<asp:UpdatePanel ID="up1" runat="server">
<Triggers>
<asp:PostBackTrigger ControlID="IBtnSave" />
<asp:PostBackTrigger ControlID="ddlAgent" />
<asp:PostBackTrigger ControlID="btnSelectCity" />
<asp:PostBackTrigger ControlID="imgBtnAgent" />
<asp:PostBackTrigger ControlID="ImgBtnCancel" />
</Triggers>
progress bar code is
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="up1"
DynamicLayout="true">
<ProgressTemplate>
<div id="Progressbar" class="Progressbar" align="center" valign="middle" runat="server">
<asp:Image ID="Image1" Width="75" Height="95" runat="server" ImageUrl="~/images/animation_processing.gif" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
how to solve that problem, please give me any suggestion
Thank u
hemanth
i can find out the answer it is working
just write the java script like this
<script type="text/javascript">
var updateProgress = null;
function postbackButtonClick() {
updateProgress = $find("<%= UpdateProgress1.ClientID %>");
window.setTimeout("updateProgress.set_visible(true)", updateProgress.get_displayAfter());
return true;
}
</script>
after that
<asp:UpdatePanel runat="server">
<Triggers>
<asp:PostBackTrigger ControlID="IBtnSave" />
</Triggers>
button onclick event just call that function like this
<asp:Button ID="IBtnSave" runat="server" Text="Save" CssClass="art-button"
ClientIDMode="Static" onclick="IBtnSave_Click" OnClientClick="return postbackButtonClick();"/>

Resources