Solved

Need to convert an html form into an asp.net control

Posted on 2012-04-09
9
556 Views
Last Modified: 2012-04-25
This seems like it shouldn't be that hard but I'm not sure how to do this.

An outside contractor has handed me an html form for our site.

Our site is in sitefinity and I would like to convert this thing to an asp.net control.

However just slapping the html into the ascx file makes the cms editor lock up.

I know I can translate the inputs to textboxes, the options to a drop-down list etc. but how do I get the data sent when the original form had something like this:

<form action="https://theirsite/servlet/servlet.WebToCase?encoding=UTF-8\" method="POST">
inputs
options
hidden fields

<input type="submit" name="submit" />
</form>
0
Comment
Question by:EndeavorToPersevere
  • 6
  • 3
9 Comments
 
LVL 38

Expert Comment

by:Tom Beck
ID: 37825393
You can change your form tag to <form ID="form1" runat="server"> and add runat="server" to all inputs. They will behave just like asp:textboxes, etc.
0
 
LVL 2

Author Comment

by:EndeavorToPersevere
ID: 37825423
So how does the data get passed to http://theirsite/servlet/servlet.WebToCase?encoding=UTF-8 when the button gets clicked?

Do I need to put code in the btnSubmit_Click event?
0
 
LVL 2

Author Comment

by:EndeavorToPersevere
ID: 37825443
We currently have this page http://www.metalogix.com/events.aspx that uses hard-coded html. I am trying to have it automatically build from the events but I am running into trouble resolving the URL for the Registration URL.

Line 706 in the attached control code is where I am trying to translate this - can you please tell me the correct call to get a properly resolved URL - I am expecting something like "https://metalogix.webex.com/metalogix/lsr.php?AT=pb&SP=EC&rID=4989677&rKey=0663671568042aaf" after it is resolved.

Thanks!
0
 
LVL 38

Expert Comment

by:Tom Beck
ID: 37825652
I'm not familiar with sitefinity specifically, but putting runat="server" in your form tag will cause the data in the inputs for that page to be posted to itself on the server side where you can retrieve the values for any inputs with the runat="server" attribute. From there you can do whatever you need including calling a Web Service to parse the data entered and return a value.

Did you intend to attach some code? Line 706??
0
Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

 
LVL 2

Author Comment

by:EndeavorToPersevere
ID: 37827581
Sorry tommyBoy - the thing about line 706 was going in a trouble ticket for Sitefinity. Copy/paste error.

I appreciate your thoughts. Unfortunately the contractor is not providing a web service interface.

So what I'm left trying to sort out is some way to pass the data from aspx so it looks like it came from the html form.

I guess I 'm stuck making an html page with Javascript validation outside the CMS.
0
 
LVL 38

Assisted Solution

by:Tom Beck
Tom Beck earned 500 total points
ID: 37828020
I cannot see the difference. A form is a form. Post data is post data. You can redirect from the server to any url you need. If you are submitting your html form to an outside url, you can submit your asp.net form to an outside url. With asp.net, you have the option to do server side validation first if that is what you require. The url you are submitting to will not see any difference. Unless I'm missing something in your particular situation.
0
 
LVL 2

Author Comment

by:EndeavorToPersevere
ID: 37828370
Maybe I'm missing something obvious, here's the setup.

Our site runs on Sitefinity which is an ASP.Net / Telerik / C# based system (it does do VB.Net too but C# is preferred).

To create a page I have
- a .master file which contains the header, body, a form statement and various divs and content place holders to create the layout. The master I am trying to use is based on html 5.
- a theme with a style sheet and images to create the page look

I upload the .master file to Sitefinity and tie it to the theme as a template.

From there when I create a page I select the template which gives me the skeleton of the page.

I then fill the page with "generic content" html or controls/widgets (.ascx) that are built-in or I write.

Normally when we talk to the system this vendor has added on to, I talk through a web service. In this case, they want to hand me an html form to use.

What I want to do is have this page be in the CMS like any other page so the text on it can be edited/styled like the rest of the pages. I want to do validation preferably in C# and not Javascript and possibly add the captcha we are using on the other pages and then send the data off to them.

When I tried just slapping the html in an ascx file it locked up the page editor in the CMS. I'm reading that you can't have nested forms.
0
 
LVL 2

Accepted Solution

by:
EndeavorToPersevere earned 0 total points
ID: 37873243
Just in case someone else runs across this, here is how I solved it. There may be a more elegant solution but this one is working except for dealing with the browser back button  (my next thread :-)  )

I ended up making the form an aspx page outside the cms. Here are a few things I had to deal with:
The form had to be posted to another server on completion
Some of the fields had to have names that weren't valid asp.net IDs - like 00x00000xxx
Once the form had an action, the submit button click event didn't get called

I ended up with:
starting with the form not having any action associated with it
declaring the fields with normal names, then changing their ID's on page load and using the new names on the requiredfieldvalidators for the controltovalidate field and in the javascript when I referenced them
going with a "validate" button that would make sure everything was valid, disable the fields so the user couldn't change them, set the form's action field and swap the validate button for a submit button
I ended up using Telerik's button because it had a client-side on-clicking event that would let me re-enable the fields at the last second so they would get picked up by the other application when the form posted

Here's the aspx file:
<%@ Page Title="" Language="C#" AutoEventWireup="true" CodeFile="SubmitTicket.aspx.cs" Inherits="Tools_SubmitTicket" %>
<%@ Register src="../mynav/TopNav-MegaDD.ascx" tagname="TopNav_MegaDD" tagprefix="uc1" %>
<%@ Register TagPrefix="recaptcha" Namespace="Recaptcha" Assembly="Recaptcha" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Metalogix Submit Support Ticket</title>
    <link rel="stylesheet" type="text/css" href="/mysheets.css" />
</head>

<body>
    <form runat="server" id="form1" method="post" onsubmit="formsubmit">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div id="wrapper">
        <div id="header">
            <div id="hdrtop">
 		logos and other header stuff
            </div>
            <uc1:TopNav_MegaDD ID="TopNav_MegaDD1" runat="server"/>
        </div>
        <img src="my img" />
        <div id="content">
    	    <h1>Submit a <em>Support Ticket</em></h1>
    	    <div class="content">
                <p><em>Note: all fields are required</em></p>
                <telerik:RadButton ID="submit" runat="server" Text="Submit" ButtonType="LinkButton" Enabled="False" Visible="False" CommandArgument="SubmitCommand" CommandName="SubmitCommand" OnClientClicking="SubmitClicking" Image-IsBackgroundImage="True" Image-ImageUrl="/stylesheets/SubmitTicketImages/validateSubmitButtons.png">
                </telerik:RadButton>
                <input type=hidden name="retURL" value="http://www.metalogix.com/Support/Submit-Support-Ticket/Submit-Support-Ticket-Thank-You.aspx">

                input fields and validators
                <br />

                <input type="hidden"  id="external" name="external" value="1" />

               <div id="recaptchabox">
                    <recaptcha:RecaptchaControl ID="recaptcha" runat="server" PublicKey="mypublickey" PrivateKey="myprivatekey" Theme="white" />                  
                </div>
                
                <asp:LinkButton ID="validate" runat="server" OnCommand="btnValidate_Command" 
                    CommandArgument="ValidateCommand" CommandName="ValidateCommand"><span>validate</span></asp:LinkButton>
             

                <p>&nbsp;</p>
            </div>
	    </div>
        <p>&nbsp;</p>
    </div>

    <%-- Submit clicking - reenable all fields so they are recorded properly --%>
        <script type="text/javascript">
            function SubmitClicking(sender, args) {
                var userinput = document.getElementById('name');
                userinput.disabled = false;
                etc.

            }
        </script>
    <%--end Submit Clicking--%>
    <%--Submit Form--%>
    <script type="text/javascript">
        function formsubmit(sender, args) 
        {
            var submitButton = document.getElementById('submit');
            submitButton.disabled = true;
            submitButton.visible = false;

            var validateButton = document.getElementById('validate');
            validateButton.disabled = false;
            validateButton.visible = true;
        }
    </script>
    <%--end Submit Form--%>
    </form>
</body>
</html>

Open in new window


Here's the code behind:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Text.RegularExpressions;

public partial class Tools_SubmitTicket : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        country.ID = "00x00000000xxx";
        ProductArea.ID = "00x00000000oxxx";
        ContractType.ID = "00x00000000oxxx";
        version.ID = "00x00000000xxx";
        Region.ID = "00x00000000xxx";
        LicenseKey.ID = "00x00000000xxx";

        // force the browser to do a full 
        // page reload if it comes back here (note this is not working yet)
        Response.Cache.SetCacheability(HttpCacheability.NoCache);
        Response.Cache.SetExpires(DateTime.Now);
    }

    protected void btnValidate_Command(object sender, EventArgs e)
    {
            if (Page.IsValid)
            {
                // disable the text fields to prevent changes
                name.Enabled = false;
                email.Enabled = false;
                etc.

                // hide the captcha
                recaptcha.Enabled = false;
                recaptcha.Visible = false;

                // switch the validate and submit buttons
                validate.Enabled = false;
                validate.Visible = false;

                submit.Enabled = true;
                submit.Visible = true;

                // set the action to call the other site
                Form.Action = "https://www.othersite.com/servlet/servlet.application?encoding=UTF-8";

            }
    }

}

Open in new window

0
 
LVL 2

Author Closing Comment

by:EndeavorToPersevere
ID: 37890933
Thanks to tommyBoy for giving me the hints to get started on this.
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

Entity Framework is a powerful tool to help you interact with the DataBase but still doesn't help much when we have a Stored Procedure that returns more than one resultset. The solution takes some of out-of-the-box thinking; read on!
Exception Handling is in the core of any application that is able to dignify its name. In this article, I'll guide you through the process of writing a DRY (Don't Repeat Yourself) Exception Handling mechanism, using Aspect Oriented Programming.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now