Careers
An error occurred while processing the template.
The following has evaluated to null or missing:
==> formInstanceId [in template "20116#20152#46029905" at line 278, column 37]
----
Tip: If the failing expression is known to be legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)??
----
----
FTL stack trace ("~" means nesting-related):
- Failed at: ${formInstanceId} [in template "20116#20152#46029905" at line 278, column 35]
----
1<style>
2.notification{
3 position: fixed;
4 top: 20px;
5 right: 20px;
6 z-index: 99999;
7 display: none;
8 max-width: 350px;
9 border: 1px solid;
10}
11.notification-text{
12 padding: 30px;
13}
14.error{
15 background-color: #fff;
16}
17.success{
18 background-color: #fff;
19}
20.notification-tittle{
21 display: block;
22 font-weight: bold;
23 padding: 30px;
24 background-color: #D53F43;
25 color: #fff;
26 font-size: 18px;
27}
28
29.notification-tittle .glyphicon{
30 margin-left: 5px;
31}
32
33.b-form__component-container input.form-control{
34 background-color: #fafafa;
35 border: 1px solid #cccccc;
36 border-width: 1px;
37 height: 40px;
38}
39
40.b-form__component-container select.form-control{
41 background-color: #fafafa;
42 border: 1px solid #cccccc;
43 border-width: 1px;
44}
45
46.b-form__component-container textarea.form-control{
47 background-color: #fafafa;
48 border: 1px solid #cccccc;
49 border-width: 1px;
50 resize:none;
51}
52
53.b-form__component-container .form-group label{
54 color: #000;
55 font-size: 16px;
56 line-height: 24px;
57 font-family: "Roboto", sans-serif;
58 text-transform: capitalize;
59 margin-bottom: 15px;
60}
61
62.b-form__component-container .form-group label.checkbox-default{
63 padding-left: 20px;
64}
65
66.b-form__component-container .custom-file-upload{
67 border: solid 1px #000000;
68 font-size: 11px;
69 font-family: "Roboto", sans-serif;
70 text-transform: uppercase;
71 letter-spacing: 2px;
72 line-height: 10px;
73 padding: 16px;
74 font-weight: bold;
75 width:90px;
76 height: 40px;
77}
78
79.b-form__component-container .b-form__inputFile{
80 display: block;
81 margin-bottom: 38px;
82}
83.b-form__component-container .b-form__inputFile-text{
84 display: inline-block;
85 padding-left: 10px;
86}
87
88.b-form__component-container .radio-inline+.radio-inline, .checkbox-inline+.checkbox-inline{
89 margin-left: 0;
90}
91.b-form__component-container .radio-inline{
92 margin-right: 0;
93 padding-left: 20px;
94}
95
96.b-form__component-container .btn.btn-lg.btn-primary{
97 border: solid 1px #000000;
98 font-size: 11px;
99 font-family: "Roboto", sans-serif;
100 text-transform: uppercase;
101 letter-spacing: 2px;
102 line-height: 10px;
103 padding: 10px;
104 font-weight: bold;
105 background-color: white;
106 color: black;
107 border-radius: 0;
108 width: 221px;
109 height: 40px;
110 float: none !important;
111 left: 50%;
112 position: relative;
113 transform: translateX(-50%);
114 margin-bottom: 40px;
115 margin-top: 40px;
116}
117
118.b-form__component-container .ddl-form-basic-info{
119 display: none;
120}
121
122.b-form__component-container .liferay-ddm-form-field-paragraph .control-label{
123 padding: 20px 0;
124 margin: 0;
125}
126
127.b-form__component-container .liferay-ddm-form-field-paragraph hr{
128 border-top: 0px solid #999;
129 margin-bottom: 0px;
130 margin-top: 0px;
131 margin-bottom: 0px;
132 border: 1px solid;
133 border-top: 0px solid #eee;
134}
135
136
137
138.b-form__component-container .active.lfr-ddm-form-page .row input, .b-form__component-container .active.lfr-ddm-form-page .row .input-group-container, .b-form__component-container .active.lfr-ddm-form-page .row label.control-label, .b-form__component-container .active.lfr-ddm-form-page .row select, .b-form__component-container .active.lfr-ddm-form-page .row textarea, .b-form__component-container .lfr-ddm-form-container .lfr-ddm-form-pagination-controls {
139 width: 100%;
140}
141@media (max-width: 768px) {
142 .b-form__component-container .active.lfr-ddm-form-page .row input[type="checkbox"],
143 .b-form__component-container .active.lfr-ddm-form-page .row input[type="radio"]{
144 width: auto !important;
145 }
146 .b-form__component-container .form-group label{
147 width: 50%
148 }
149
150 .b-cemex-button__inline {
151 display: block;
152 width: 90%;
153 margin-bottom: 10px;
154 }
155}
156
157/*START: Job Application specific styles*/
158 #job-application-container .form-group.liferay-ddm-form-field-paragraph > label{
159 font-family: Roboto;
160 font-size: 40px !important;
161 font-weight: bold;
162 font-style: normal;
163 font-stretch: normal;
164 line-height: normal;
165 letter-spacing: normal;
166 text-align: left;
167 color: #000000;
168 margin-bottom: 48px;
169 }
170
171 .b-form__component-container .liferay-ddm-form-field-paragraph div p{
172
173 font-family: Roboto;
174 font-size: 24px;
175 font-weight: normal;
176 font-style: normal;
177 font-stretch: normal;
178 line-height: 1.5;
179 letter-spacing: 0.5px;
180 text-align: left;
181 color: #000000;
182 border-bottom: 2px solid #45474e;
183 padding-bottom: 48px;
184 margin-bottom: 48px;
185 }
186
187 #b-form-input-File-name-loaded{
188 width: 200px;
189 display: inline-block;
190 margin-right: 20px;
191 }
192
193 .b-form-file-label{
194 display: block;
195 margin-bottom: 16px;
196 }
197
198 .lfr-ddm-form-content > .lfr-ddm-form-pages > .active.lfr-ddm-form-page .row:not(:first-child){
199 margin-bottom: 32px !important;
200 }
201
202 .active.lfr-ddm-form-page .row textarea{
203 height: 149px;
204 max-height: 149px;
205 min-height: 149px;
206 }
207
208 .help-block{
209 color: #a94442;
210 }
211 .lfr-ddm-form-container .lfr-ddm-form-field-container .icon-asterisk.text-warning{
212 display: inline !important;
213 }
214/*END: Job Application specific styles*/
215
216</style>
217
218<#function getParamsOfInputFiles items>
219<#assign isFirstItem = true />
220<#assign itemsToCreate = "" />
221<#assign emailProfileValue = "" />
222
223<#if emailProfile?? && emailProfile.getData()?? && emailProfile.getData()?trim != "">
224 <#assign emailProfileValue = emailProfile.getData() />
225</#if>
226
227<#list items as item>
228<#if !isFirstItem>
229<#assign itemsToCreate = itemsToCreate+","/>
230</#if>
231<#assign itemsToCreate = itemsToCreate + "${item.inputName.getData()?trim}" />
232<#assign isFirstItem = false />
233</#list>
234<#assign itemsToCreate = itemsToCreate+"" />
235
236<#return itemsToCreate/>
237</#function>
238
239
240<#assign currentUrl = themeDisplay.getPortalURL() + themeDisplay.getURLCurrent() />
241<#assign croppedUrl = currentUrl?keep_before_last("/job-application.aspx") + "/thank-you-page-job-application.aspx">
242
243
244<#if FormLocale.getSiblings()?has_content>
245<#list FormLocale.getSiblings() as formLocale>
246<#if locale == formLocale.getData() >
247<#assign formInstanceId = "portlet_com_liferay_dynamic_data_lists_form_web_portlet_DDLFormPortlet_INSTANCE_"+FormGroupId.getData()+"_"+formLocale.getData()>
248
249
250<#if emailProfile?? && emailProfile.getData()?? && emailProfile.getData()?trim != "">
251 <#assign emailProfileValue = emailProfile.getData() />
252</#if>
253
254<div id="job-application-container" class="row">
255 <div class="col-sm-offset-2 col-sm-8">
256 <div class="b-form__component-container ${formLocale.getData()}">
257 <@liferay_portlet["runtime"]
258 defaultPreferences=""
259 instanceId="${FormGroupId.getData()}_${formLocale.getData()}"
260 portletName="com_liferay_dynamic_data_lists_form_web_portlet_DDLFormPortlet"
261 />
262 </div>
263 </div>
264</div>
265
266
267</#if>
268</#list>
269</#if>
270<#if inputFile.getSiblings()?has_content>
271 <#assign items2 = getParamsOfInputFiles(inputFile.getSiblings()) />
272</#if>
273<script type="text/javascript">
274 AUI().ready(function(){
275 "use strict";
276
277 (function () {
278 var id = "${formInstanceId}";
279 var some = "${items2}";
280
281 var url_string = window.location.href;
282 var url = new URL(url_string);
283 var vacancyName = url.searchParams.get("vacancy-name");
284
285 var inputContainers = $('.input-group-container > input');
286 var jobPositionContainer = inputContainers[0];
287 jobPositionContainer.value = vacancyName;
288
289 function setformAccions(){
290
291
292 var form = $("#" + id).find("form");
293
294
295 var formName = $(form).find(".ddl-form-name").html();
296 var formID = form.attr("id");
297 var formbutton = form.find("button[type='submit']");
298 var action = form.attr("action");
299 var formValues = form.serialize();
300 $(formbutton).prop("type", "button");
301 formbutton.on("click", function () {
302 form.submit();
303 });
304
305 var inputContainers = $('.input-group-container > input');
306 var jobPositionContainer = inputContainers[0];
307 jobPositionContainer.value = vacancyName;
308
309 setAttatchments(formID);
310 form.on("submit", function ($event) {
311
312 var allRequiredFieldsVerification = checkRequiredFields();
313
314 if(allRequiredFieldsVerification){
315 $.ajax({
316 type: "POST",
317 url: action,
318 data: form.serialize(),
319 success: function success(data) {
320 var successCounter = data.match(/successfully/g).length;
321 if (successCounter > 2) {
322 var values = {};
323 $.each(form.serializeArray(), function (i, field) {
324 if (field.name.indexOf("$$") !== -1) {
325 var name = field.name.split("$$")[1].split("$")[0];
326 if (!!values[name]) {
327 values[name] = [field.value].concat(values[name]);
328 } else {
329 values[name] = field.value;
330 }
331 }
332 });
333
334 var nform = $('#b-form-input-Files-Div')[0];
335
336 var newform = new FormData(nform);
337
338 var content = "";
339 var keys = Object.keys(values);
340
341 keys.forEach(function (key) {
342 if (Array.isArray(values[key])) {
343 content += "<p style=\"color:#9aa2a6; font-size:18px; margin:32px 0 16px 0\">" + key + "</p><p style=\"font-size:16px; margin:0\">" + values[key].toString() + "</p>";
344 } else {
345 content += "<p style=\"color:#9aa2a6; font-size:18px; margin:32px 0 16px 0\">" + key + "</p><p style=\"font-size:16px; margin:0\">" + values[key] + "</p>";
346 }
347 });
348
349 var user = Liferay.ThemeDisplay.getUserName() !== "" ? Liferay.ThemeDisplay.getUserName(): "Guest";
350 var messageContent = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"><html xmlns=\"http://www.w3.org/1999/xhtml\"><head><meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\"/><title>Email From Liferay</title><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"/><style></style></head><body style=\"margin: 0; padding: 0;\"><table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"100%\"><tr><td><table align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"600\" style=\"background-color:#e4e9ec; padding:40px\"><tbody><tr><td><div id=\"x_introduction\" style=\"background-color:#fff; border-radius:4px; margin:0 auto 24px auto; padding:40px\"><h2 align=\"center\" style=\"margin-bottom:24px; margin-top:0\">Hi,</h2><p style=\"line-height:30px; margin-bottom:24px; margin-top:0\">A new entry was submitted for the Job Application form.</div></td></tr><tr><td><h3 style=\"color:#9aa2a6; font-weight:300; margin:8px 0 8px; text-align:center\">Here's what was entered into the form:</h3><div style=\"background-color:#fff; border-radius:4px; margin:0 auto 24px auto; padding:40px\"><h4 style=\"color:#9aa2a6; font-size:21px; font-weight:500; margin:0\"></h4>"+content+"</div></td></tr></tbody></table></td></tr></table></body></html>";
351
352
353 newform.append("bodyMail", messageContent);
354
355 var group = defineGroupToSend();
356 newform.append("groupToSend", group);
357 newform.append("groupID", themeDisplay.getScopeGroupId());
358 newform.append("DDLDefinitionID","46234819");
359
360
361 $.ajax({
362 url : "/o/mailer/send",
363 type: "POST",
364 enctype: 'multipart/form-data',
365 cache: false,
366 contentType: false,
367 processData: false,
368 data : newform,
369 success: function(response){
370 cleanForm(form);
371 cleanForm(nform);
372 showNotification({
373 title: 'Success!',
374 text: "Your information was sent successfully",
375 type: 'success',
376 time: 3000,
377 });
378 location.href = "${croppedUrl}"
379 },
380 error: function(response){
381 showNotification({
382 title: 'Error!',
383 text: "Ooops, looks like we have a problem with the server, try again!",
384 type: 'error',
385 time: 3000,
386 });
387 }
388 });
389
390 }else{
391 showNotification({
392 title: 'Error!',
393 text: "Ooops, looks like we have a problem with your info, try again!",
394 type: 'error',
395 time: 3000,
396 });
397
398 }
399 }
400 });
401 }
402
403 $event.preventDefault();
404 });
405
406}
407
408function checkRequiredFields(){
409
410 var allFieldsChecked = false;
411
412 var requiredFields = $('span.icon-asterisk.text-warning').parent().parent().parent();
413 var requiredFieldsIds = [];
414 for(var i = 0; i<requiredFields.length; i++){
415 requiredFieldsIds[i] = requiredFields[i].id;
416 }
417
418 var missingFields = [];
419 var missingFieldsId = [];
420 var fieldValue = "";
421 for(var i = 0; i<requiredFields.length; i++){
422 if(requiredFieldsIds[i] != "b-form-input-Files-Div"){
423 fieldValue = $('#' + requiredFieldsIds[i]).children().children().children()[1].value;
424 if(fieldValue == "" || fieldValue == null){
425 missingFields.push( $('#' + requiredFieldsIds[i]).children().children().children()[1] );
426 missingFieldsId.push('#' + requiredFieldsIds[i]);
427 }
428 } else{
429 fieldValue = $('#' + requiredFieldsIds[i] + " input")[0].value;
430 if(fieldValue == "" || fieldValue == null){
431 missingFields.push( $('#' + requiredFieldsIds[i] + " input")[0] );
432 missingFieldsId.push('#' + requiredFieldsIds[i]);
433 }
434
435 }
436 }
437
438 if (missingFields.length != 0){
439 allFieldsChecked = false;
440
441 if( $(missingFieldsId[0]).find(".help-block").length == 0){
442 $("<div class='help-block'>This field is required.</div>").insertAfter($(missingFields[0]));
443 } else {
444 }
445
446
447
448 var firstMissingField = AUI().one(missingFieldsId[0]);
449 firstMissingField.scrollIntoView();
450
451 } else{
452 allFieldsChecked = true;
453 }
454
455 return allFieldsChecked;
456}
457
458
459
460function defineGroupToSend(){
461 var isEnableCustomDestination = "${customDestination.getData()}";
462 var emailProfile = "${emailProfileValue}";
463 var groupToSend = "default";
464 var fistVariable = "";
465 var secondVariable = "";
466 if(isEnableCustomDestination === "true"){
467 $(".input-select-wrapper").each(function(i, element){
468 var label = $(element).find("label");
469 if(label[0].innerText.toLowerCase() === "area / location"){
470 var select = $(element).find("select");
471 fistVariable = select.val().toLowerCase();
472 }
473 });
474
475 $(".radio.radio-options").each(function(i, element){
476 var label = $(element).siblings("label");
477 if(label[0].innerText.toLowerCase() === "products"){
478 var select = $(element).find("input:checked");
479 secondVariable = select.val().toLowerCase();
480 }
481 });
482
483 if(!!secondVariable && secondVariable !== '' && !!fistVariable && fistVariable !== ''){
484 if(secondVariable === 'aggregates'){
485 if ( fistVariable === "cheshire" || fistVariable === "cumbria" || fistVariable === "durham" || fistVariable === "east riding of yorkshire" || fistVariable === "greater manchester" || fistVariable === "lancashire" || fistVariable === "merseyside" || fistVariable === "northumberland" || fistVariable === "north yorkshire" || fistVariable === "south yorkshire" || fistVariable === "teeside" || fistVariable === "tyneside" || fistVariable === "west yorkshire" || fistVariable === "wales - north"){
486 groupToSend = "group1-"+slugfy(secondVariable.toLowerCase());
487 }else if(fistVariable === "scotland"){
488 groupToSend = "group2-"+slugfy(secondVariable.toLowerCase());
489 }else{
490 groupToSend = ""+slugfy(secondVariable.toLowerCase());
491 }
492 }
493 }else{
494 groupToSend = slugfy(secondVariable.toLowerCase());
495 }
496 } else {
497 if(emailProfile != ""){
498 var url_string = window.location.href;
499 var url = new URL(url_string);
500 var department = url.searchParams.get("department");
501 if(department != null && department.trim() != ""){
502 groupToSend = decodeURIComponent(department.trim());
503 } else {
504 groupToSend = emailProfile;
505 }
506 }
507 }
508
509 return groupToSend;
510}
511
512function setAttatchments(formID){
513 if(some !== ""){
514 var elements = some.split(",");
515
516 var contenedor = document.querySelector("#"+formID+" .lfr-ddm-form-content .active.lfr-ddm-form-page");
517
518
519 var inputFilesDiv = document.createElement("form");
520 inputFilesDiv.id = "b-form-input-Files-Div";
521 var attatchmentsLabel = document.createElement("label");
522
523 elements.forEach(function (e) {
524 var divInput = document.createElement("div");
525
526
527
528 var span = document.createElement("span");
529 span.classList = "b-form-file-label";
530
531 var asterisk = document.createElement("span");
532 asterisk.classList.add("icon-asterisk", "text-warning");
533
534
535
536 var label = document.createElement("label");
537 var text = document.createTextNode("Browse");
538
539
540 var spanText = document.createTextNode(e);
541 var divInputFileText = document.createElement("div");
542 divInput.classList = "b-form__inputFile";
543 divInputFileText.classList = "b-form__inputFile-text "+e;
544
545 var fileInput = document.createElement("input");
546 fileInput.className += "input form-control";
547 fileInput.id = "b-form-input-File-name-loaded";
548 fileInput.disabled = true;
549
550 label.setAttribute("for", slugfy(e));
551 label.classList = "custom-file-upload";
552
553 span.appendChild(spanText);
554
555 span.append(asterisk);
556 label.appendChild(text);
557
558 divInput.appendChild(span);
559 divInput.appendChild(fileInput);
560 divInput.appendChild(label);
561
562
563
564 divInput.appendChild(divInputFileText);
565
566
567
568
569 var input = document.createElement("input");
570 input.type = "file";
571 input.name = slugfy(e);
572 input.id = slugfy(e);
573 input.classList="hidden";
574 input.accept = ".jpg, .jpeg, .png, .doc, .docx, .pdf";
575 divInput.appendChild(input);
576 inputFilesDiv.appendChild(divInput);
577 });
578
579
580 var here = $(".lfr-ddm-form-content > .lfr-ddm-form-pages > .active.lfr-ddm-form-page .row")[4];
581 $(inputFilesDiv).insertAfter(here);
582
583 }
584
585 $('#b-form-input-Files-Div input[type="file"]').on("change", function($event){
586 $('#b-form-input-File-name-loaded').val($event.target.files[0].name);
587 });
588
589 $(".checkbox-multiple-options").find("label").addClass("col-xs-6 col-md-4");
590 $(".radio.radio-options").find("label").addClass("col-xs-6 col-md-4");
591
592}
593
594function cleanForm(form){
595 $(form).find('input:text, input:password, input:file, select, textarea').val('');
596 $(form).find('input:radio, input:checkbox').removeAttr('checked').removeAttr('selected');
597 $(form).find('.b-form__inputFile-text').html("No file chosen");
598 $(form).find('.help-block').remove();
599}
600
601function slugfy(e){
602 return e.replace(/ /g, "-");
603}
604
605
606
607function showNotification(notificationObj){
608 var divTop = document.createElement("div");
609 divTop.classList.add("notification");
610 divTop.classList.add(notificationObj.type);
611 divTop.setAttribute("id", "notificationPopUp");
612
613 var divContent = document.createElement("div");
614 divContent.classList.add("nofitication-content");
615
616 var spanTitle = document.createElement("span");
617 spanTitle.classList.add("notification-tittle");
618 spanTitle.classList.add("text-capitalize");
619 var titleText = document.createTextNode(notificationObj.title);
620
621
622 var spanTitleIcon = document.createElement("span");
623 spanTitleIcon.classList.add("glyphicon");
624 if(notificationObj.type === "error"){
625 spanTitleIcon.classList.add("glyphicon-remove-circle");
626 }else{
627 spanTitleIcon.classList.add("glyphicon-ok-circle");
628 }
629
630 var divTextContent = document.createElement("div");
631 divTextContent.classList.add("notification-text");
632
633 var spanContent = document.createElement("span");
634 var contentText = document.createTextNode(notificationObj.text);
635
636 spanTitle.appendChild(titleText);
637 spanTitle.appendChild(spanTitleIcon);
638 spanContent.appendChild(contentText);
639 divTextContent.appendChild(spanContent);
640
641 divContent.appendChild(spanTitle);
642 divContent.appendChild(divTextContent);
643
644 divTop.appendChild(divContent);
645 document.body.appendChild(divTop);
646 $("#notificationPopUp").slideToggle( "slow" );
647
648 setTimeout(function(){
649 $("#notificationPopUp").slideToggle( "slow" );
650 }, notificationObj.time );
651
652 setTimeout(function(){
653 $("#notificationPopUp").remove();
654 $("#b-email-modal-component__content .lfr-alert-container").hide();
655 }, notificationObj.time + 1500);
656
657}
658
659var interval = setInterval(function(){
660 if(some !== "" && $("#b-form-input-Files-Div").length === 0){
661 setformAccions();
662 clearInterval(interval);
663 }else{
664 clearInterval(interval);
665 }
666}, 500);
667
668
669})(jQuery);
670});
671</script>