Mimic Questionnaire Add New

[Saravanan]

I am looking to mimic the questionnaire add new field, to place it on another application.  I did debug and took the onclick value of Add New button.  If i pass that value directly in HTML, the link is working fine.  But if i try to pass that via javascript, i am getting unexpected error.  I am trying to pass through Javascript as Content id of the application varies for each record.  Please help me to send dynamic values to onclick function for questionnaire Add New purpose.

Working Code:

<a title="Add New" class="ml-command-item add-new" id="custom_Add_New2" onclick = "javascript:$pb('{&quot;a&quot;:[{&quot;Key&quot;:&quot;fieldid&quot;,&quot;Value&quot;:&quot;22910&quot;},{&quot;Key&quot;:&quot;moduleId&quot;,&quot;Value&quot;:&quot;572&quot;},{&quot;Key&quot;:&quot;levelid&quot;,&quot;Value&quot;:&quot;370&quot;},{&quot;Key&quot;:&quot;refmodid&quot;,&quot;Value&quot;:&quot;573&quot;},{&quot;Key&quot;:&quot;contentid&quot;,&quot;Value&quot;:&quot;484189&quot;},{&quot;Key&quot;:&quot;relatedLevelId&quot;,&quot;Value&quot;:&quot;371&quot;},{&quot;Key&quot;:&quot;questionnaireRelatedRecord&quot;,&quot;Value&quot;:&quot;True&quot;}],&quot;e&quot;:&quot;refFieldAddNew&quot;}');csp(event);return false;" href="javascript:void(0);">Add New</a>

Not Working Code:

<a title="Add New" class="ml-command-item add-new" id="custom_Add_New2" onclick="" href="javascript:void(0);">Add New</a>
<script type="text/javascript">
Sys.Application.add_load(function() {
var onclk;
onclk = "javascript:$pb('{&quot;a&quot;:[{&quot;Key&quot;:&quot;fieldid&quot;,&quot;Value&quot;:&quot;22910&quot;},{&quot;Key&quot;:&quot;moduleId&quot;,&quot;Value&quot;:&quot;572&quot;},{&quot;Key&quot;:&quot;levelid&quot;,&quot;Value&quot;:&quot;370&quot;},{&quot;Key&quot;:&quot;refmodid&quot;,&quot;Value&quot;:&quot;573&quot;},{&quot;Key&quot;:&quot;contentid&quot;,&quot;Value&quot;:&quot;484189&quot;},{&quot;Key&quot;:&quot;relatedLevelId&quot;,&quot;Value&quot;:&quot;371&quot;},{&quot;Key&quot;:&quot;questionnaireRelatedRecord&quot;,&quot;Value&quot;:&quot;True&quot;}],&quot;e&quot;:&quot;refFieldAddNew&quot;}');csp(event);return false;";
$("#custom_Add_New2").attr("onclick",onclk);

});
</script>

[Saravanan]

David Petty‌ any thoughts?

[DavidPetty · Accepted solution]

Hi Saravanan

Try the following:

<a title="Add New" class="ml-command-item add-new" id="custom_Add_New2" href="#">Add New</a>
<script type="text/javascript">
     $('#custom_Add_New2').click(function(){
          $pb('{"a":[{"Key":"fieldid","Value":"22910"},{"Key":"moduleId","Value":"572"},{"Key":"levelid","Value":"370"},{"Key":"refmodid","Value":"573"},{"Key":"contentid","Value":"484189"},{"Key":"relatedLevelId","Value":"371"},{"Key":"questionnaireRelatedRecord","Value":"True"}],"e":"refFieldAddNew"}');
          csp(event);
          return false;
     });
</script>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[Saravanan]

Its worked.  You saved me thrice in a week.  Thank you very much:)  I actually tried with .click, .on(click), addeventlistner codes.  The mistake i made was giving href as javascript:void(0) instead of href="#".

I need one more favor, i want to pass content id in $pb function dynamically.  The below code throws "Object doesnt support property or 'indexOf' "

<a title="Add New" class="ml-command-item add-new" id="custom_Add_New2" href="#">Add New</a>
<script type="text/javascript">
     $('#custom_Add_New2').click(function(){
           var temp1 ={"a":[{"Key":"fieldid","Value":"22910"},{"Key":"moduleId","Value":"572"},{"Key":"levelid","Value":"370"},
{"Key":"refmodid","Value":"573"},{"Key":"contentid","Value":""},{"Key":"relatedLevelId","Value":"371"},
{"Key":"questionnaireRelatedRecord","Value":"True"}],"e":"refFieldAddNew"};          
          temp1['a'][4]['Value']="484189";
          $pb(temp1);
          csp(event);
          return false;
     });
</script>

[DavidPetty]

Anytime Saravanan

Why not just do:

<a title="Add New" class="ml-command-item add-new" id="custom_Add_New2" href="#">Add New</a>
<script type="text/javascript">
     $('#custom_Add_New2').click(function(){
          $pb('{"a":[{"Key":"fieldid","Value":"22910"},{"Key":"moduleId","Value":"572"},{"Key":"levelid","Value":"370"},{"Key":"refmodid","Value":"573"},{"Key":"contentid","Value":"' + getRecordId() + '"},{"Key":"relatedLevelId","Value":"371"},{"Key":"questionnaireRelatedRecord","Value":"True"}],"e":"refFieldAddNew"}');
          csp(event);
          return false;
     });
</script>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[Saravanan]

Nope.. Not Working.. Its not taking the Record Id.  But i found out the issue.  Pb function was expecting a string parameter but i sent the dictionary parameter.  I converted dict to string and its worked. Again thanks for your help:)

[KennethBlacow]

Hi Saravanan Rajaram‌,

Can you post your working code? I am very new to this whole custom object space and do not know enough about Java to get this to work. I have a ODA, that is the primary record, I have a questionnaire that asks for more information about the primary record. I want to create a button called "Next" that will generate the questionnaire, but when I use the code, I get an error when the questionnaire is created that the related record is a required field. Meaning that the questionnaire target has not been selected.

Thanks,

Ken

[KennethBlacow]

Hi David Petty‌,

Instead of a hyperlink, how can I make this a button like this code?

<img class="btnnext" src="../BackgroundImageGenerator.axd?className=StyledButton&classProperties=caption:Next+Module;iconSetStyle:VistaRound;baseColor:%23DDDDDD;disabled:False"onclick="selectTab('next')"/> ‍

The code above creates a button that calls the JavaScript in another custom object.

Thanks,

Ken 

[KennethBlacow]

I found this option, for those that want to use.

<div class="toolbar-app-buttons-left">
     <a title="Set Value" class="tb-btn-link-left" id="custom_Add_New2" href="#" data-check-dirty="false">
          <div class="tb-btn" data-icon="&#xE348" data-icon-pos="left">Next</div>
     </a>
</div>
<script type="text/javascript">
     $('#custom_Add_New2').click(function(){
          $pb('{"a":[{"Key":"fieldid","Value":"24883"},{"Key":"moduleId","Value":"534"},{"Key":"levelid","Value":"332"},{"Key":"refmodid","Value":"545"},{"Key":"contentid","Value":"' + getRecordId() + '"},{"Key":"relatedLevelId","Value":"342"},{"Key":"questionnaireRelatedRecord","Value":"True"}],"e":"refFieldAddNew"}');
          csp(event);
          return false;
     });
</script>‍‍‍‍‍‍‍‍‍‍‍‍

[JordanG]

I see you managed to get something to turn it into a button already, but I figured I may as well post the code I use for these custom 'Add New' buttons in case someone else may find it handy. Same method as David for the add new, but I make the button from scratch so it can be easily modified.

<!-- Style formats how the button looks -->
<style>
	.custom-add-new-style{
		background:    #229bed;
		background:    linear-gradient(#229bed, #0084dd);
		border-radius: 11px;
		padding:       10px 20px;
		color:         #ffffff;
		font:          normal bold 15px/1 "Open Sans", sans-serif;
		text-align:    center;
		display:       inline-block;
		text-decoration: none;
	}
</style>

<!-- The button is placed inside of a table so that we can centre it on the page -->
<table style="margin-left: auto; margin-right: auto;">
	<tbody>
		<tr>
			<td style="text-align: center;">
				<a title="Add New" class="custom-add-new-style" id="custom_Add_New2" href="#">Create New AQA</a> 
			</td>
		</tr>
	</tbody>
</table>

<!-- This script is what creates the new record, you need to replace the values depending on the application you're in and the cross-reference you're wanting to do -->
<script type="text/javascript">
     $('#custom_Add_New2').click(function(){
          $pb('{"a":[{"Key":"fieldid","Value":"9739"},{"Key":"moduleId","Value":"271"},{"Key":"levelid","Value":"19"},{"Key":"refmodid","Value":"332"},{"Key":"contentid","Value":"' + getRecordId() + '"},{"Key":"relatedLevelId","Value":"72"},{"Key":"questionnaireRelatedRecord","Value":"True"}],"e":"refFieldAddNew"}');
          csp(event);
          return false;
     });
</script>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍