creating a responsive form within NetSuite

custom forms within NetSuite require the use of field tags like NLFORM and NLCATEGORY, etc. However it's unclear to me how to incorporate these tags properly into the template of a responsive form so it works.

Here's what I have so far:

<!DOCTYPE html>

<html lang="en">
<head>
<Title>General Contact Form</Title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css">
<style type="text/css">
h1, p {
  font-family: 'Lato', sans-serif;
  }
</style>
</head>

<Body>
<div class="container">
<h1>
<center>Submit a Message</center>
</h1>
 <form class="form-horizontal">
<NLFORM>
<br>
<fieldset>
<legend>How Can We Help You?</legend>
<div class="form-group">
<p class="control-label col-sm-2">Type of Inquiry*</p>
<div class="col-sm-10">
<NLCATEGORY>
</div>
</div>
<div class="form-group">
<p class="control-label col-sm-2">Subject*</p>
<div class="col-sm-10"><NLTITLE> </div></div>
<div class="form-group">
<p class="control-label col-sm-2">Message*</label>
<div class="col-sm-10"><NLINCOMINGMESSAGE> </div></div>
<div class="form-group">
<label class="control-label col-sm-2" for="NLFILE">File Upload</label>
<div class="col-sm-10"><NLFILE> </div></div>
</fieldset>

<fieldset>
<legend>Contact Information</legend>
<div class="form-group">
<label class="control-label col-sm-2" for="first-name">First Name*</label>
<div class="col-sm-10">
<NLFIRSTNAME></div></div>
<div class="form-group">
<label class="control-label col-sm-2" for ="NLLASTNAME">Last Name*</label>
<div class="col-sm-10"><NLLASTNAME></div></div>
<div class="form-group">
<label class="control-label col-sm-2" for="NLEMAIL">E-mail*</label>
<div class="col-sm-10"><NLEMAIL> </div></div>
<div class="form-group">
<label class="control-label col-sm-2" for="NLPHONE">Phone</label>
<div class="col-sm-10"><NLPHONE> </div></div>
<div class="form-group">
<label class="control-label col-sm-2" for="NLCOUNTRY">Country</label>
<div class="col-sm-10"><NLCOUNTRY> </div></div>
</fieldset>


<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input type="submit" value="Submit"> - or - 
<input type="button" value="Reset" onclick="page_reset(); return false;"></div></div>
<NLSUBSIDIARY>
<br>
<p align=center>Fields marked with an<img src="http://shopping.na2.netsuite.com/core/media/media.nl?id=35211&c=4382721&h=2eef11083f182592e0bb">are required.</p>

</form>


</Body>

</HTML>

the form fields do respond to resizing the browser window, but NetSuite is not able to properly create a record using this particular form. can anyone see what I'm doing wrong here!?

here's the form URL: http://www.boxcomponents.com/support-form

NetSuite Field Tags are controlled from within the UI; so field width is fixed and doesn't accept percentages; there are also drop-down menus which have a fixed width, which is mildly annoying. I can't seem to get the form to respond properly without removing all of NetSuite's tags.

标签： forms netsuite

1条回答

Lonely孤独者°

2楼-- · 2019-09-14 22:57

What you'll need to do is process the form with script when it opens. Add a script tag after the </form> tag to add and remove classes from the form elements.

Also this is redundant and you'll end up with some sort of broken form:

<form class="form-horizontal">
<NLFORM>

So for instance you'd just have:

<NLFORM>
   ...
</form>
<script>
jQuery(function($){
    $("#main_form").addClass('form-horizontal');
});
</script>

0人赞添加讨论(0) 举报

creating a responsive form within NetSuite

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间