Forms to Process Payments

Magentrix provides you with all the component needed to build payment forms. Below is a simplified example that shows the payment functionality.

Below screen capture demonstrates the look and feel of the final product:

Payment Form

The below markup code goes to the Active Page:

<aspx:AspxPage runat="server" Id="MyNewPage" title="Process Payments">
<body>
 
 <div class="max400">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3>Make a Payment</h3>
        </div>
        <div class="panel-body">
            <aspx:ViewSection runat='server' labelPosition="top" columns="two" showHeader="false">
                <aspx:InputField runat="server" value="{!Model.Firstname}"/>
                <aspx:InputField runat="server" value="{!Model.Lastname}"/>
            </aspx:ViewSection>
            <aspx:ViewSection runat='server' labelPosition="top" columns="one" showHeader="false">
                <aspx:FieldCardNumber runat='server' value='{!Model.CardNumber}'/>
                <aspx:FieldExpirationDate runat="server" monthValue="{!Model.ExpMonth}" yearValue="{!Model.ExpYear}" Label="Expiration Date" required="true"/>
                <aspx:FieldText runat="server" value="{!Model.CardCvc}" Width="90px"/>
            </aspx:ViewSection>
        </div>
        <div class="panel-footer right">
            <aspx:CommandButton runat='server' cssClass="btn btn-success" Text="Submit"/>
        </div>
    </div>
 </div>
 <style>
     .control-label{display:block;}
 </style>
 
</body>
</aspx:AspxPage>

Below code goes to the controller. Note that we named our page/controller "Payment":

[SerializeViewData]
public class PaymentController : AspxController
{
    public  override ActionResponse Index()
    {
        // Populate current user's default values
        var info = new ChargeInfo() {
            Firstname = SystemInfo.UserInfo.Firstname,
            Lastname = SystemInfo.UserInfo.Lastname
        };

        return View(info);
    }
    
    [HttpPost]
    public ActionResponse Index(ChargeInfo model)
    {
        // The value passed to the Stripe API, is the name of the "Connectd App" which contains Stripe credentials.
        var stripe = new Stripe("Stripe");
        TransactionResult result = stripe.Charge(model);

        // Check the results:
        if (result.Status.ToLower()!="success")
        {
            // Transaction failed.
            return RedirectToError("The transaction failed.");
        } 
        else
        {
            // The Stripe transaction Id
            string transId = result.TransactionId;
        }
        
        return View("Message", new { Title = "Thank You", Message = "Your payment is processed successfully" });
    }
}

The example above processes the payment using Stripe API, if you wish to use Authorize.NET instead, see "Processing Payments Using Authorize.Net".

Table of Contents

Forms to Process Payments