In this post, we are going to see how to call liquid template code in basic form field change.
On select of lookup, retrieve lookup value in Basic form.
Follow below steps
1. Create web template and write below liquid template
2. Create page template and refer created web template
3. Create web page and refer created page template
4. Jquery to call liquid template
1. Create web template name "GetContactEmailAddress" and add below liquid template code in source box.
{% fetchxml getcontact %}
<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false">
<entity name="contact">
<attribute name="fullname" />
<attribute name="telephone1" />
<attribute name="contactid" />
<attribute name="emailaddress1" />
<attribute name="wbab_vpu" />
<order attribute="fullname" descending="false" />
<filter type="and">
<condition attribute="contactid" operator="eq" value="{{request.params['contactid']}}" />
</filter>
</entity>
</fetch>
{% endfetchxml %}
{% if getcontact.results.entities.size > 0 %}
{
"results":
[
{% for contact in getcontact.results.entities %}
{
"emailaddress": "{{contact.emailaddress1}}",
"vpu": "{{contact.wbab_vpu}}"
}
{% unless forloop.last %},{% endunless %}
{% endfor %}
]
}
{% else %}
No data found.
{% endif %}
2. Create page template and refer created web template.
3. Create webpage and refer created page template name.
4. Below jquery to call liquid template of change of lookup field.
$("#test_cc").bind('change', function () {
// debugger;
contactclick++;
$("#test_cc_name").val("");
if (contactclick > 4) {
alert("Maximum Four CC allowed");
contactclick--;
return;
}
var contactid = $("#test_cc").val();
getContactEmail(contactid);
});
$("body").on("click", ".remove", function () {
$(this).closest("div").remove();
contactclick--;
var values = "";
$("#note").show();
$("input[name=DynamicTextBox]").each(function () {
values += $(this).val() + ";";
});
$("#test_ccemailaddress").val(values);
// alert(values);
//alert(contactclick);
});
function getContactEmail(contactrecordid){
var webTemplateURL = "";
var emailaddress = "";
var contactcollection = null;
try {
//Web tempalte url to retrieve account url
webTemplateURL = "/getemailaddress/?contactid=" + contactrecordid + "";
//alert(webTemplateURL);
//Request to custom page to get account data in json format
contactcollection = getResponse(webTemplateURL);
//Check for each account from account collection
contactcollection.results.forEach(function (contact) {
emailaddress = contact.emailaddress;
var div = $("<div/>");
div.html(GetDynamicTextBox(emailaddress));
// $("#cccontent1").html(div);
$("#TextBoxContainer").append(div).show(600);
var values = "";
// $("#note").show(1000);
$("input[name=DynamicTextBox]").each(function () {
values += $(this).val() + ";";
// values += contactid + ";";
});
// $("#ccbuttonid").attr("value",contactname);
$("#test_ccemailaddress").val(values);
});
}
catch (e) {
console.log("getAccountData :: " + e.message);
}
}
function getResponse(webTemplateURL) {
var response = null;
try {
$.ajax({
type: "GET",
url: webTemplateURL,
dataType: "json",
async: false
}).done(function (json) {
response = json;
});
} catch (e) {
console.log("getResponse :: " + e.message);
}
return response;
}
function GetDynamicTextBox(value) {
return '<input name = "DynamicTextBox" type="button" class="text-left" size ="60" style="background-color:white ;border-style:double;border-width:think;border-color:#5DADE2;display: block; width:230px; height: 25px; margin:0px; float: left;" value = "' + value + '" readonly/>' +
'<input type="button" style="background-color:white;border-width:thin;border-color:#5DADE2; display: block; margin-right: 5px;padding:0px width: 20px; height: 25px; float:left;" value="x" class="remove" />'
}
