Hi,
I have a SAS Job with HTML form code which is used in iframe of SAS Visual Investigator's (SVI) page. Without the HTML form code, the SAS Job code correctly fetch the parameter values such as customer_id and first_name of the current entity's SVI page. But when I added the HTML form code, the HTML form code cannot fetch the parameter values; thus, it cannot pass the value to SAS Job code.
See attached SAS Job code and HTML form code. This is the URL I used in iframe of SAS Job page:
/SASJobExecution/?_program=%2FUsers%2Fviadmin%2FHTML%20JOB%20Test%2FTest&customer_id={%1}&first_name={%2}&last_name={%3} with parameter values
{%1} = customer_id {%2} = first_name {%3} = last_name
Below is the html form code I used:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Run SAS Job</title> <style> body { margin: 0; padding: 8px; font-family: "Segoe UI", Arial, sans-serif; font-size: 14px; background-color: white; }
.form-wrapper { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
select, button { font-family: "Segoe UI", Arial, sans-serif; font-size: 14px; padding: 4px 6px; border: 1px solid #999; border-radius: 2px; background-color: white; color: #0078B8; }
button:hover { background-color: #f0f0f0; cursor: pointer; }
iframe { width: 100%; height: 300px; background: white; border: 1px solid #999; } </style> </head> <body>
<form id="dataForm" method="get" action="/SASJobExecution/" target="resultsFrame"> <!-- SAS Job Path --> <input type="hidden" name="_program" value="$PROGRAM$"> <input type="hidden" name="_action" value="execute">
<!-- Hidden Inputs --> <input type="hidden" name="CUSTOMER_ID" value="{%1}"> <input type="hidden" name="FIRST_NAME" value="{%2}"> <input type="hidden" name="LAST_NAME" value="{%3}"> <div class="form-wrapper"> <select name="data_type" id="data_type" required> <option value="" disabled selected>Select</option> <option value="Customer ID Report">Customer ID Report</option> <option value="Name Report">Name Report</option> </select>
<button type="submit" onclick="handleSubmit(event)">Request Report</button> </div> </form>
<!-- Output iframe below --> <iframe name="resultsFrame" id="resultsFrame" src="about:blank"></iframe>
<script> function handleSubmit(event) { event.preventDefault(); // Prevent default form submission
const iframe = document.getElementById('resultsFrame'); const form = document.getElementById('dataForm');
// Show "Running..." message inside iframe const runningHTML = ` <html> <head> <style> body { font-family: "Segoe UI", Arial, sans-serif; font-size: 14px; padding: 10px; color: orange; } </style> </head> <body> ⏳ Job Running... <span style="font-weight: normal">Started at: ${new Date().toLocaleString()}</span> </body> </html> `;
const blob = new Blob([runningHTML], { type: 'text/html' }); iframe.src=URL.createObjectURL(blob);
// Submit form after short delay to allow iframe update setTimeout(() => { form.submit(); }, 150); } </script> </body> </html>
I hope someone can help me on solving the correct code to use in HTML form code. Thanks. - Rian
... View more
