0

How can i receive data from the form(using html & css) in visualforce page and as well as to insert these information into custom object .I seen previous posts but those are related to other languages,can anyone help me. thanks in advance...

<apex:page>

<style type="text/css">
    #wrapper {
        width:450px;
        margin:0 auto;
        font-family:Verdana, sans-serif;
    }
    legend {
        color:#0481b1;
        font-size:16px;
        padding:0 10px;
        background:#fff;
        -moz-border-radius:4px;
        box-shadow: 0 1px 5px rgba(4, 129, 177, 0.5);
        padding:5px 10px;
        text-transform:uppercase;
        font-family:Helvetica, sans-serif;
        font-weight:bold;
    }
    fieldset {
        border-radius:4px;
        background: #fff; 
        background: -moz-linear-gradient(#fff, #f9fdff);
        background: -o-linear-gradient(#fff, #f9fdff);
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#f9fdff)); /
        background: -webkit-linear-gradient(#fff, #f9fdff);
        padding:20px;
        border-color:rgba(4, 129, 177, 0.4);
    }
    input,
    textarea {
        color: #373737;
        background: #fff;
        border: 1px solid #CCCCCC;
        color: #aaa;
        font-size: 14px;
        line-height: 1.2em;
        margin-bottom:15px;

        -moz-border-radius:4px;
        -webkit-border-radius:4px;
        border-radius:4px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.2);
    }
    input[type="text"],
    input[type="password"]{
        padding: 8px 6px;
        height: 22px;
        width:280px;
    }
    input[type="text"]:focus,
    input[type="password"]:focus {
        background:#f5fcfe;
        text-indent: 0;
        z-index: 1;
        color: #373737;
        -webkit-transition-duration: 400ms;
        -webkit-transition-property: width, background;
        -webkit-transition-timing-function: ease;
        -moz-transition-duration: 400ms;
        -moz-transition-property: width, background;
        -moz-transition-timing-function: ease;
        -o-transition-duration: 400ms;
        -o-transition-property: width, background;
        -o-transition-timing-function: ease;
        width: 380px;

        border-color:#ccc;
        box-shadow:0 0 5px rgba(4, 129, 177, 0.5);
        opacity:0.6;
    }
    input[type="submit"]{
        background: #222;
        border: none;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
        text-transform:uppercase;
        color: #eee;
        cursor: pointer;
        font-size: 15px;
        margin: 5px 0;
        padding: 5px 22px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        -webkit-border-radius:4px;
        -webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
        -moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
        box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
    }
    textarea {
        padding:3px;
        width:96%;
        height:100px;
    }
    textarea:focus {
        background:#ebf8fd;
        text-indent: 0;
        z-index: 1;
        color: #373737;
        opacity:0.6;
        box-shadow:0 0 5px rgba(4, 129, 177, 0.5);
        border-color:#ccc;
    }
    .small {
        line-height:14px;
        font-size:12px;
        color:#999898;
        margin-bottom:3px;
    }
</style>
<body>
    <div id="wrapper">
        <form action="" method="post">
            <fieldset>
                <legend>Wait List form for Attendee </legend>
                <div>
                    <input type="text" name="first_name" placeholder="First Name"/>
                </div>
                <div>
                    <input type="text" name="last_name" placeholder="Last Name"/>
                </div>
                <div>
                    <input type="password" name="first_name" placeholder="Password"/>
                </div>
                <div>
                    <input type="text" name="email" placeholder="Email"/>
                </div>
                <div>
                    <input type="text" name="email" placeholder="Number Of Tickets"/>
                </div>    
                <input type="submit" name="Save" value = "save" />
            </fieldset>    
        </form>
    </div>
</body>

</apex:page>

enter image description here

Improve this question
4
  • are you using Visualforce page and apex controller? Commented Nov 20, 2015 at 19:13
  • yes Ratan, using Visualforce page and apex controller... Commented Nov 20, 2015 at 19:26
  • Can you post your apex controller code !!!! Commented Nov 20, 2015 at 19:34
  • I haven't implemented controller yet, waiting for better way to implement this,can you give me suggestion Commented Nov 20, 2015 at 19:38

1 Answer 1

Reset to default
0

Instead of CustomObject__c object use your object and firstName, lastName use your object fields.

<apex:page controller="myController">
    <apex:form>
    <style type="text/css">
        /*your style code*/
    </style>
    <body>
        <div id="wrapper">
                <fieldset>
                    <legend>Wait List form for Attendee </legend>
                    <div>
                        <apex:inputField value="{obj.FirstName}" html-placeholder="First Name"/>
                    </div>
                    <div>
                        <apex:inputField value="{obj.LastName}" html-placeholder="Last Name"/>
                    </div>
                    <div>
                        <apex:inputField value="{obj.password}" html-placeholder="Password"/>
                    </div>
                    <div>
                        <apex:inputField value="{obj.email}" html-placeholder="Email"/>
                    </div>
                    <apex:commandbutton action="{!createRecord}"  />
                </fieldset>   
        </div>
    </body>
    </apex:form>
    </apex:page>

controller 

public class myController
{
    public CustomObject__c obj {get;set;}
    public myController()
    {
       obj = new CustomObject__c();

    }
     public PageReference createRecord()
     {
       insert obj;
        return new PageReference('\'+obj.Id);
     }
}
Improve this answer
1
  • Thank you so much Ratan, i got understand and will try this.thank you... Commented Nov 20, 2015 at 19:45

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.