ZeroDay Fracture ZeroDay Fracture -3 years ago 81
Javascript Question

How to add javascript content in asp.net page

I am trying to add a very simple sage payment wall in my webpage and when I import the script it seems not be calling the js script. I'm new to asp.net and cannot figure out how to execute the script block, im using code behind as well in C#. This is my very simple asp.net code for transaction processing.

<%@ Page Language="C#" Inherits="MG_CreditCard_Authenticator_1.Default" %>
<!DOCTYPE html>


<html>

<head runat="server">
<title>Default</title>


</head>



<body>

<form id="form1" runat="server" >
<div id="topLevel" runat="server" margin="100px">
<asp:Label id="InvoiceLable" runat="server" Text="Invoice" />
<asp:TextBox id="InvoiceTextBox" runat="server" TextMode="Password" />
</div>

<div id="secondTopLevel" runat="server" >
<asp:Label id="DateLabel" runat="server" Text="Date"/>
<asp:TextBox id="DateTextBox" runat="server"/>
</div>
<div id="thirdTopLevel" runat="server">
<asp:Button id="button1" runat="server" Text="Finish" OnClick="button1Clicked" />
</div>
<div id="form2" runat="server">

<asp:TextBox id="postInflow" runat="server" Height="200px" Width="400px" ReadOnly="true" TextMode="MultiLine" />
<asp:Button id="genRecipt" runat="server" Text="Generate" OnClick="ACHauth" />

<script type="text/javascript" src="https://www.sagepayments.net/pay/1.0.2/js/pay.min.js"></script>

<!-- <script language="javascript"src='<%=ResolveUrl("PaymentHandler.js")%>' type='text/javascript'</script>
-->

</div>
</form>

</body>
</html>


And this my C# code behind code

using System;
using System.Web;
using System.Web.UI;

namespace MG_CreditCard_Authenticator_1
{

public partial class Default : System.Web.UI.Page
{
String invoiceNumber = "Invoice Number";
//String Date = "";
//String outputData = "";
//int buttonclicks = 0;


public void button1Clicked(object sender, EventArgs args)
{

button1.Text = "Done";
invoiceNumber = InvoiceTextBox.Text;
InvoiceLable.Text = "Invoice Number";
postInflow.Text = "Displaying info for Invoice Number: "+InvoiceTextBox.Text+" made on "+DateTextBox.Text;

Page.ClientScript.RegisterClientScriptInclude("Registration", ResolveUrl("/Users/ShashankMurthy/Projects/MG_CreditCard_Authenticator_1.03/MG_CreditCard_Authenticator_1.03/PaymentHandler.js"));

}

public void GetValue(String key){

var appConfig = System.IO.File.ReadAllText(key);
}
public void ACHauth(object sender, EventArgs args){
}
}
}


I have tried all the solutions I could find online, but the javascript function is not being called.

Javascript file I created for the script

<script type="text/javascript">
PayJS(['PayJS/UI'], // loading the UI module...
function($UI) { // ... and assigning it to a variable
$UI.Initialize({
elementId: "paymentButton",
// identifiers (no keys!):
clientId: "myClientId", // https://developer.sagepayments.com/user/register
merchantId: "999999999997",
// auth, covered later:
authKey: "ABCD==",
salt: "DEFG==",
// config:
requestType: "payment", // or "vault" to tokenize a card for later
amount: "1.00",
orderNumber: "Invoice12345",
// convenience:
addFakeData: true,
});
});
</script>


Updated asp.net code

<%@ Page Language="C#" Inherits="MG_CreditCard_Authenticator_1.Default" %>
<!DOCTYPE html>


<html>

<head runat="server">
<title>Default</title>


</head>



<body>

<form id="form1" runat="server" >
<div id="topLevel" runat="server" margin="100px">
<asp:Label id="InvoiceLable" runat="server" Text="Invoice" />
<asp:TextBox id="InvoiceTextBox" runat="server" TextMode="Password" />
</div>

<div id="secondTopLevel" runat="server" >
<asp:Label id="DateLabel" runat="server" Text="Date"/>
<asp:TextBox id="DateTextBox" runat="server"/>
</div>
<div id="thirdTopLevel" runat="server">
<asp:Button id="button1" runat="server" Text="Finish" OnClick="button1Clicked" />
</div>
<div id="form2" runat="server">

<asp:TextBox id="postInflow" runat="server" Height="200px" Width="400px" ReadOnly="true" TextMode="MultiLine" />

<script type="text/javascript" src="https://www.sagepayments.net/pay/1.0.2/js/pay.min.js"></script>

<button id="paymentButton">
Click
</button>

<script type="text/javascript">
PayJS(['PayJS/UI'], // loading the UI module...
function($UI) { // ... and assigning it to a variable
$UI.Initialize({
elementId: "paymentButton",
// identifiers (no keys!):
clientId: "myClientId", // https://developer.sagepayments.com/user/register
merchantId: "999999999997",
// auth, covered later:
authKey: "ABCD==",
salt: "DEFG==",
// config:
requestType: "payment", // or "vault" to tokenize a card for later
amount: "1.00",
orderNumber: "Invoice12345",
// convenience:
addFakeData: true,
});
});
</script>




</div>



</form>

</body>
</html>

Answer Source

I don't think you want the ASP buttons doing post backs to the codebehind. You can see here https://jsfiddle.net/ax67cpjt/ that I just added your script and a button with the id paymentButton and it works fine.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download