<!-- Add Custom Field Button and Dialog Box -->
-{* New field form *}
-<div id="{$fid}_NewFieldDialog" class="glm-dialog-box" style="width: 100%" title="Enter a New Custom Field">
+{* New/Edit field form *}
+<div id="FieldDialog_{$fid}" class="glm-dialog-box" style="width: 100%" title="Enter a New Custom Field">
<table class="glm-admin-table" style="width: 100%">
<tr>
<th class="glm-required">Field Name:</th>
<td>
- <input id="{$fid}_NewFieldName" type="text" name="field_name" class="glm-form-text-input-short">
+ <input id="FieldName_{$fid}" type="text" name="field_name" class="glm-form-text-input-short">
<br>(for reference - keep short)
</td>
</tr>
<tr>
<th class="glm-required" style="width: 20%; white-space: nowrap;">User Prompt:</th>
- <td><input id="{$fid}_NewFieldPrompt" type="text" name="field_prompt" class="glm-form-text-input"></td>
+ <td><input id="FieldPrompt_{$fid}" type="text" name="field_prompt" class="glm-form-text-input"></td>
</tr>
<tr>
<th style="width: 20%; white-space: nowrap;" class="glm-required">Field Type:</th>
<td>
- <select id="{$fid}_NewFieldType" name="field_type">
+ <select id="FieldType_{$fid}" name="field_type">
<option value=""></option>
{foreach $fieldTypes as $type}
<option value="{$type.type_name}">{$type.prompt}</option>
<tr>
<th style="width: 20%; white-space: nowrap;">Important Field:</th>
<td>
- <input id="{$fid}_NewFieldPriorityDisplay" type="checkbox" name="priority_display">
+ <input id="FieldPriorityDisplay_{$fid}" type="checkbox" name="priority_display">
Display when limited output is selected.
</td>
</tr>
<tr>
<th style="width: 20%; white-space: nowrap;">Required:</th>
- <td><input id="{$fid}_NewFieldRequired" type="checkbox" name="required"></td>
+ <td><input id="FieldRequired_{$fid}" type="checkbox" name="required"></td>
</tr>
</table>
<p><span class="glm-required">*</span> Required</p>
- <div id="{$fid}_NewFieldCancel" class="button button-primary glm-right">Cancel</div>
- <div id="{$fid}_NewFieldSubmit" class="button button-primary">Add new Custom Field</div>
- <div id="{$fid}_NewFieldDialogError" class="glm-error" style="display: none;"><p>Unable to create custom field. Did you supply all required information?</p></div>
+ <div id="FieldCancel_{$fid}" class="button button-primary glm-right">Cancel</div>
+ <div id="FieldSubmit_{$fid}" class="button button-primary" data-fieldId="">(name supplied by code below)</div>
+ <div id="FieldDialogError_{$fid}" class="glm-error" style="display: none;"><p>Unable to create custom field. Did you supply all required information?</p></div>
</div>
{* Delete field button confirmation dialog box *}
-<div id="{$fid}_DeleteFieldDialog" class="glm-dialog-box" title="Delete Field">
+<div id="DeleteFieldDialog_{$fid}" class="glm-dialog-box" title="Delete Field">
<center>
<p>Are you sure you want to delete this field?</p>
- <p><div id="{$fid}_DeleteFieldConfirm" class="button button-primary">Yes, delete this field</div></p>
- <p><div id="{$fid}_DeleteFieldCancel" class="button button-primary">Cancel</div></p>
+ <p><div id="DeleteFieldConfirm_{$fid}" class="button button-primary">Yes, delete this field</div></p>
+ <p><div id="DeleteFieldCancel_{$fid}" class="button button-primary">Cancel</div></p>
</center>
</div>
-{* Edit field dialog box -- NOT IMPLEMENTED YET *}
-<div id="{$fid}_editFieldDialog" class="glm-dialog-box" title="Edit this Field">
- <table class="glm-admin-table" style="width: 100%;">
- <tr>
- <th class="glm-required" style="width: 20%; white-space: nowrap;">Field Name:</th>
- <td><input id="{$fid}_editFieldName" type="text" name="field_name" class="glm-form-text-input-short"></td>
- </tr>
- <tr>
- <th class="glm-required" style="width: 20%; white-space: nowrap;">User Prompt:</th>
- <td><input id="{$fid}_editFieldPrompt" type="text" name="field_prompt" class="glm-form-text-input"></td>
- </tr>
- <tr>
- <th class="glm-required" style="width: 20%; white-space: nowrap;">Field Type:</th>
- <td>
- <select id="{$fid}_editFieldType" name="field_type">
- <option value=""></option>
- {foreach $field_types as $val => $label}
- <option value="{$val}">{$label}</option>
- {/foreach}
- </select>
- </td>
- </tr>
- <tr>
- <th>Priority:</th>
- <td><input type="checkbox" id="{$fid}_editPriority" name="priority_display" value="1" /></td>
- </tr>
- <tr>
- <th>Required:</th>
- <td><input type="checkbox" id="{$fid}_editRequired" name="required" value="1" /></td>
- </tr>
- </table>
- <p><span class="glm-required">*</span> Required</p>
- <a id="{$fid}_editFieldCancel" class="button button-primary glm-right">Cancel</a>
- <input type="submit" value="Update this Field">
-</div>
-
{* New Picklist Option form *}
-<div id="{$fid}_NewOptionDialog" class="glm-dialog-box" style="width: 100%" title="Add a New Option">
+<div id="NewOptionDialog_{$fid}" class="glm-dialog-box" style="width: 100%" title="Add a New Option">
<table class="glm-admin-table" style="width: 100%">
<tr>
<th class="glm-required" style="width: 20%; white-space: nowrap;">Option Name:</th>
<td>
- <input id="{$fid}_NewOptionValue" type="text" name="option_value" class="glm-form-text-input-short">
+ <input id="NewOptionValue_{$fid}" type="text" name="option_value" class="glm-form-text-input-short">
<br>(For reference - keep short)
</td>
</tr>
<tr>
<th class="glm-required">Displayed Text:</th>
- <td><input id="{$fid}_NewOptionText" type="text" name="option_text" class="glm-form-text-input"></td>
+ <td><input id="NewOptionText_{$fid}" type="text" name="option_text" class="glm-form-text-input"></td>
</tr>
<tr>
<th style="width: 20%; white-space: nowrap;">Selected by Dedault</th>
- <td><input id="{$fid}_NewOptionDefault" type="checkbox" name="option_default"></td>
+ <td><input id="NewOptionDefault_{$fid}" type="checkbox" name="option_default"></td>
</tr>
<tr>
<th>Cost:</th>
- <td>$<input id="{$fid}_NewOptionCost" type="text" name="option_cost" class="glm-form-text-input-veryshort"></td>
+ <td>$<input id="NewOptionCost_{$fid}" type="text" name="option_cost" class="glm-form-text-input-veryshort"></td>
</tr>
</table>
<p><span class="glm-required">*</span> Required</p>
- <div id="{$fid}_NewOptionCancel" class="button button-primary glm-right">Cancel</div>
- <div id="{$fid}_NewOptionSubmit" class="button button-primary" data-fieldId="">Add new Picklist Option</div>
- <div id="{$fid}_NewOptionDialogError" class="glm-error" style="display: none;"><p>Unable to create picklist option. Did you supply all required information?</p></div>
+ <div id="NewOptionCancel_{$fid}" class="button button-primary glm-right">Cancel</div>
+ <div id="NewOptionSubmit_{$fid}" class="button button-primary" data-fieldId="">Add new Picklist Option</div>
+ <div id="NewOptionDialogError_{$fid}" class="glm-error" style="display: none;"><p>Unable to create picklist option. Did you supply all required information?</p></div>
</div>
{* Fields Table *}
-<table class="" style="width: 100%; background-color: #fff; border: 1px solid black; l">
+<table id="FieldsTable_{$fid}" class="" style="width: 100%; background-color: #fff; border: 1px solid black; l">
+ <thead>
<tr style="background-color: #ddd;">
<th style="text-align: left;">Field Name</th>
<th style="text-align: left;">Type</th>
+ <th style="text-align: left;">Priority</th>
<th style="text-align: left;">Required</th>
<th style="text-align: left;" width="10%" colspan="2">
- <div id="{$fid}_newFieldButton" class="button button-primary glm-button-small">Add a Custom Field</div>
+ <div id="newFieldButton_{$fid}" class="button button-primary glm-button-small">Add a Custom Field</div>
</th>
</tr>
- <tbody id="{$fid}_FieldsListBody">
+ </thead>
{if $haveCustomFields}
{foreach $custom_fields as $t}
+ <tbody id="field_{$t.id}">
<tr class="FieldRow_{$t.id}">
- <th style="font-weight: bold; text-align: left;">{$t.field_name}</th>
- <td style="text-align: left;" id="editFieldType_{$t.id}">
- {$t.field_type_descr}
- </td>
- <td style="text-align: left;">
- {$t.required.name}
- </td>
- <td style="width: 10%; text-align: left;" colspan="2">
-<!-- <div class="{$fid}_EditFieldButton button button-secondary glm-button-small"
- data-fieldId="{$t.id}"
- data-fieldName="{$t.field_name|escape:'html'}"
- data-fieldPrompt="{$t.field_prompt|escape:'html'}"
- data-fieldType="{$t.field_type.name|escape:'html'}"
- data-priority="{$t.priority_display.value}"
- data-required="{$t.required.value}"
- >Edit</div>
- -->
- <div class="{$fid}_DeleteFieldButton button button-secondary glm-button-small" data-fieldId="{$t.id}">Delete</div>
- {if $t.field_type=='picklist'}
- <div class="{$fid}_AddOptionButton button button-secondary glm-button-small" data-fieldId="{$t.id}">Add Option</div>
- {/if}
+ <th style="font-weight: bold; text-align: left;" id="DisplayFieldName_{$t.id}">{$t.field_name}</th>
+ <td style="text-align: left;" id="DisplayFieldTypeDescr_{$t.id}">{$t.field_type_descr}</td>
+ <td style="text-align: left;" id="DisplayFieldPriority_{$t.id}">{$t.priority_display.name}</td>
+ <td style="text-align: left;" id="DisplayFieldRequired_{$t.id}">{$t.required.name}</td>
+ <td style="width: 10%; text-align: right;" colspan="2">
+ <div class="DeleteFieldButton_{$fid} button button-secondary glm-button-small" data-fieldId="{$t.id}">Delete</div>
+ <div id="DisplayFieldEditButton_{$t.id}" class="EditFieldButton_{$fid} button button-secondary glm-button-small"
+ data-fieldId="{$t.id}"
+ data-fieldName="{$t.field_name|escape:'html'}"
+ data-fieldPrompt="{$t.field_prompt|escape:'html'}"
+ data-fieldType="{$t.field_type}"
+ data-priority="{$t.priority_display.value}"
+ data-required="{$t.required.value}"
+ >Edit</div>
</td>
</tr>
- <tr class="FieldRow_{$t.id}"><td colspan="4"">Prompt: {$t.field_prompt}</td></tr>
- {if $t.field_type=='picklist'}
- <tr class="FieldRow_{$t.id}">
- <th style="text-align: left; padding-left: 2rem;">Option Name</th>
- <th style="text-align: left;">Option Text</th>
- <th style="text-align: left;">Cost</th>
- <th style="text-align: left;">Default</th>
- <th> </th>
+ <tr class="FieldRow_{$t.id} FieldRow_{$t.id}_replace">
+ <td colspan="5" style="text-align: left; padding-left: 2rem;">Prompt: <span id="DisplayFieldPrompt_{$t.id}">{$t.field_prompt}</span></td>
</tr>
- {if $t.options}
- {foreach $t.options as $option}
- <tr id="FieldOptionRow_{$option.id}" class="FieldRow_{$t.id}">
- <td style="text-align: left; padding-left: 2rem;">{$option.option_value}</td>
- <td style="text-align: left;">{$option.option_text}</td>
- <td style="text-align: left;">{$option.option_cost}</td>
- <td style="text-align: left;">{$option.option_default.name}</td>
- <td style="text-align: left;">
- <div class="DeleteOptionButton_{$fid} button button-secondary glm-button-small" data-fieldOptionId="{$option.id}">Delete</div>
+ {if $t.field_type=='picklist'}
+ <tr id="PicklistField_{$t.id}">
+ <td colspan="5" style="padding-left: 2rem;">
+ <table id="PicklistOptions_{$t.id}" width="100%">
+ <tr class="FieldRow_{$t.id}" style="background-color: #ddd;">
+ <th style="text-align: left;">Option Name</th>
+ <th style="text-align: left;">Option Text</th>
+ <th style="text-align: left;">Cost</th>
+ <th style="text-align: left;">Default</th>
+ <th style="text-align: right;">
+ <div class="AddOptionButton_{$fid} button button-secondary glm-button-small" data-fieldId="{$t.id}">Add Option</div>
+ </th>
+ </tr>
+ {if $t.options}
+ {foreach $t.options as $option}
+ <tr id="FieldOptionRow_{$option.id}" class="FieldRow_{$t.id}">
+ <td style="text-align: left;">{$option.option_value}</td>
+ <td style="text-align: left;">{$option.option_text}</td>
+ <td style="text-align: left;">${$option.option_cost|number_format:2}</td>
+ <td style="text-align: left;">{$option.option_default.name}</td>
+ <td style="text-align: right;">
+ <div class="DeleteOptionButton_{$fid} button button-secondary glm-button-small" data-fieldOptionId="{$option.id}">Delete</div>
+ <div class="EditOptionButton_{$fid} button button-secondary glm-button-small" data-fieldOptionId="{$option.id}">Edit</div>
+ </td>
+ </tr>
+ {/foreach}
+ {/if}
+ </table>
</td>
</tr>
- {/foreach}
- {/if}
- {/if}
- <tr id="EndOfFieldOptions_{$t.id}" class="FieldRow_{$t.id}"><td style="border-bottom: 1px solid black;" colspan="5"> </td></tr>
+ {/if}
+ <tr id="EndOfField_{$fieldData.id}" class="FieldRow_{$fieldData.id}"><td style="border-bottom: 1px solid black;" colspan="5"> </td></tr>
+ </tbody>
{/foreach}
{/if}
- </tbody>
</table>
<!-- Tests -->
<script type="text/javascript">
jQuery(document).ready(function($) {
- var {$fid}_deleteId = false;
+ var deleteId_{$fid} = false;
/*
- * New field dialog box
+ * New/Edit field dialog box
*/
- // Ssetup
- $("#{$fid}_NewFieldDialog").dialog({
+ // Setup
+ $("#FieldDialog_{$fid}").dialog({
autoOpen: false,
minWidth: 600,
dialogClass: "glm-dialog-no-close"
});
+ // Cancel
+ $('#FieldCancel_{$fid}').click( function() {
+ $("#FieldDialog_{$fid}").dialog("close");
+ });
+
+ /*
+ * New Field Form
+ */
// Display form and reset all input
- $('#{$fid}_newFieldButton').click( function() {
- $("#{$fid}_NewFieldDialog").dialog("open");
- $('#{$fid}_NewFieldName').val('');
- $('#{$fid}_NewFieldPrompt').val('');
- $('#{$fid}_NewFieldType').prop('selectedIndex',0);
- $('#{$fid}_NewFieldPriorityDisplay').removeAttr('checked');
- $('#{$fid}_NewFieldRequired').removeAttr('checked');
+ $('#newFieldButton_{$fid}').click( function() {
+ $('#FieldSubmit_{$fid}').data('data-fieldId', '');
+ $('#FieldName_{$fid}').val('');
+ $('#FieldPrompt_{$fid}').val('');
+ $('#FieldType_{$fid}').prop('selectedIndex',0);
+ $('#FieldPriorityDisplay_{$fid}').removeAttr('checked');
+ $('#FieldRequired_{$fid}').removeAttr('checked');
+
+ $('#FieldSubmit_{$fid}').html('New Custom Field');
+ $("#FieldDialog_{$fid}").dialog('open');
});
- // Submit form
- $('#{$fid}_NewFieldSubmit').click( function() {
- // Collect the new field data
+ /*
+ * Submit Field
+ */
+ $('#FieldSubmit_{$fid}').click( function() {
+
+ var customFieldSubmitOption = 'addNewField';
+ if ($('#FieldSubmit_{$fid}').data('data-fieldId') != '') {
+ customFieldSubmitOption = 'updateField';
+ }
+
+ // Collect the new / edited field data
var formData = {
'action': 'glm_members_admin_ajax',
'glm_action': 'customFields',
- 'option': 'addNewField',
+ 'option': customFieldSubmitOption,
'fid': '{$fid}',
- 'field_name': $('#{$fid}_NewFieldName').val(),
- 'field_prompt': $('#{$fid}_NewFieldPrompt').val(),
- 'field_type': $('#{$fid}_NewFieldType').val(),
- 'priority_display': $('#{$fid}_NewFieldPriorityDisplay').is(':checked'),
- 'required': $('#{$fid}_NewFieldRequired').is(':checked')
+ 'fieldId': $('#FieldSubmit_{$fid}').data('data-fieldId'),
+ 'field_name': $('#FieldName_{$fid}').val(),
+ 'field_prompt': $('#FieldPrompt_{$fid}').val(),
+ 'field_type': $('#FieldType_{$fid}').val(),
+ 'priority_display': $('#FieldPriorityDisplay_{$fid}').is(':checked'),
+ 'required': $('#FieldRequired_{$fid}').is(':checked')
};
+ // Check changing from and to picklist
+ if (customFieldSubmitOption == 'updateField') {
+ var currentType = $('#DisplayFieldEditButton_' + formData.fieldId).attr('data-fieldType');
+
+ if ((currentType == 'picklist' || formData.field_type == 'picklist') && currentType != formData.field_type) {
+ alert('Sorry, you are not permitted to change the field type from a picklist to something\nelse or to a picklist from something else.\n\nConsider creating a new field.\n\n');
+ return false
+ }
+ }
+
+
// Submit new field data - expect field new ID back
$.ajax({
type: 'POST',
})
.done( function(fieldHtml) {
if (fieldHtml == '') {
- flashElement('{$fid}_NewFieldDialogError');
+ flashElement('FieldDialogError_{$fid}');
} else {
- // Add new field to form
- $('#{$fid}_FieldsListBody').append(fieldHtml);
- $("#{$fid}_NewFieldDialog").dialog("close");
-
- // Need to rebind some buttons
- $('body').off('click', '.{$fid}_EditFieldButton', {$fid}_editFieldButton);
- $('body').on('click', '.{$fid}_EditFieldButton', {$fid}_editFieldButton);
- $('body').off('click', '.{$fid}_DeleteFieldButton', {$fid}_deleteFieldButton);
- $('body').on('click', '.{$fid}_DeleteFieldButton', {$fid}_deleteFieldButton);
- $('body').off('click', '.{$fid}_AddOptionButton', {$fid}_AddOptionButton);
- $('body').on('click', '.{$fid}_AddOptionButton', {$fid}_AddOptionButton);
- $('body').off('click', '#{$fid}_NewOptionCancel', {$fid}_NewOptionCancel);
- $('body').on('click', '#{$fid}_NewOptionCancel', {$fid}_NewOptionCancel);
+ // If this is a new field
+ if (customFieldSubmitOption == 'addNewField') {
+
+ // Add new field HTML
+ $('#FieldsTable_{$fid}').append(fieldHtml);
+
+ // Need to rebind some buttons
+ $('body').off('click', '.EditFieldButton_{$fid}', editFieldButton_{$fid});
+ $('body').on('click', '.EditFieldButton_{$fid}', editFieldButton_{$fid});
+ $('body').off('click', '.DeleteFieldButton_{$fid}', deleteFieldButton_{$fid});
+ $('body').on('click', '.DeleteFieldButton_{$fid}', deleteFieldButton_{$fid});
+ $('body').off('click', '.AddOptionButton_{$fid}', addOptionButton_{$fid});
+ $('body').on('click', '.AddOptionButton_{$fid}', addOptionButton_{$fid});
+ $('body').off('click', '#NewOptionCancel_{$fid}', NewOptionCancel_{$fid});
+ $('body').on('click', '#NewOptionCancel_{$fid}', NewOptionCancel_{$fid});
+
+ // Otherwise this is a field update
+ } else {
+
+ var fieldId = formData.fieldId;
+ var priority = (formData.priority_display == true ? 'Yes':'No');
+ var required = (formData.required == true ? 'Yes':'No');
+
+ // Update the displayed values
+ $('#DisplayFieldName_' + fieldId).html(formData.field_name);
+ $('#DisplayFieldTypeDescr_' + fieldId).html($('#FieldType_{$fid} :selected').text());
+ $('#DisplayFieldPriority_' + fieldId).html((formData.priority_display ? 'Yes':'No'));
+ $('#DisplayFieldRequired_' + fieldId).html((formData.required ? 'Yes':'No'));
+ $('#DisplayFieldPrompt_' + fieldId).html(formData.field_prompt);
+
+ // Update hidden values used for editing
+ $('#DisplayFieldEditButton_' + fieldId).attr('data-fieldType', formData.field_type);
+ $('#DisplayFieldEditButton_' + fieldId).attr('data-priority', (formData.priority_display ? 1 : 0));
+ $('#DisplayFieldEditButton_' + fieldId).attr('data-required', (formData.required ? 1 : 0));
+
+ }
+ $("#FieldDialog_{$fid}").dialog("close");
}
});
});
- // Cancel
- $('#{$fid}_NewFieldCancel').click( function() {
- $("#{$fid}_NewFieldDialog").dialog("close");
- });
/*
- * Edit field dialog box
+ * Edit field
*/
- // Setup
- $("#editFieldDialog").dialog({
- autoOpen: false,
- minWidth: 400,
- dialogClass: "glm-dialog-no-close"
- });
- // Display form
- $('body').on('click', '.{$fid}_EditFieldButton', {$fid}_editFieldButton);
- function {$fid}_editFieldButton(e) {
- var fieldID = $(this).attr('data-fieldId');
+ $('body').on('click', '.EditFieldButton_{$fid}', editFieldButton_{$fid});
+ function editFieldButton_{$fid}(e) {
+
+ var fieldId = $(this).attr('data-fieldId');
var fieldName = $(this).attr('data-fieldName');
var fieldPrompt = $(this).attr('data-fieldPrompt');
var fieldType = $(this).attr('data-fieldType');
- var priority = $(this).attr('data-priority');
- var required = $(this).attr('data-required');
-
- $('#editFieldID').val(fieldID);
- $('#editFieldName').val(fieldName.trim());
- $('#editFieldPrompt').val(fieldPrompt.trim());
- $('#editFieldType').val(fieldType);
-
- // check required fields
- if (required === '1') {
- $('#editRequired').prop('checked', true);
- } else {
- console.log('setting the checked to false');
- $('#editRequired').prop('checked', false);
- }
- $("#editFieldDialog").dialog("open");
+ var priority = ($(this).attr('data-priority') == 1);
+ var required = ($(this).attr('data-required') == 1);
+
+ $('#FieldSubmit_{$fid}').data('data-fieldId', fieldId);
+ $('#FieldName_{$fid}').val(fieldName);
+ $('#FieldPrompt_{$fid}').val(fieldPrompt);
+ $('#FieldType_{$fid}').val(fieldType);
+ $('#FieldPriorityDisplay_{$fid}').prop('checked', priority);
+ $('#FieldRequired_{$fid}').prop('checked', required);
+
+ $('#FieldSubmit_{$fid}').html('Update Custom Field');
+ $("#FieldDialog_{$fid}").dialog("open");
}
- // Cancel
- $('#editFieldCancel').click( function() {
- $("#editFieldDialog").dialog("close");
- });
/*
- * Delete field dialog box
+ * Delete Field Dialog
*/
// Setup
- $("#{$fid}_DeleteFieldDialog").dialog({
+ $("#DeleteFieldDialog_{$fid}").dialog({
autoOpen: false,
minWidth: 400,
dialogClass: "glm-dialog-no-close"
});
- // Display form
- $('body').on('click', '.{$fid}_DeleteFieldButton', {$fid}_deleteFieldButton);
- function {$fid}_deleteFieldButton() {
- $('#{$fid}_DeleteFieldConfirm').data('data-fieldId', $(this).attr('data-fieldId'));
- $("#{$fid}_DeleteFieldDialog").dialog("open");
+
+ /*
+ * Delete Field
+ */
+ $('body').on('click', '.DeleteFieldButton_{$fid}', deleteFieldButton_{$fid});
+ function deleteFieldButton_{$fid}() {
+ $('#DeleteFieldConfirm_{$fid}').data('data-fieldId', $(this).attr('data-fieldId'));
+ $("#DeleteFieldDialog_{$fid}").dialog("open");
}
- // Delete confirmed
- $('#{$fid}_DeleteFieldConfirm').click( function() {
+ // Cancel
+ $('#DeleteFieldCancel_{$fid}').click( function() {
+ $("#DeleteFieldDialog_{$fid}").dialog("close");
+ });
- var {$fid}_deleteId = $('#{$fid}_DeleteFieldConfirm').data('data-fieldId');
+ /*
+ * Delete Field Submit
+ */
+ $('#DeleteFieldConfirm_{$fid}').click( function() {
+
+ var deleteId_{$fid} = $('#DeleteFieldConfirm_{$fid}').data('data-fieldId');
// Delete the selected form and remove it from the display
var formData = {
'action': 'glm_members_admin_ajax',
'glm_action': 'customFields',
'option': 'deleteField',
- 'id': {$fid}_deleteId,
+ 'id': deleteId_{$fid},
'fid': '{$fid}'
};
$.ajax({
dataType: 'text'
})
.done( function(deleted) {
- $('.FieldRow_' + {$fid}_deleteId).remove();
- $("#{$fid}_DeleteFieldDialog").dialog("close");
+ $('#field_' + deleteId_{$fid}).remove();
+ $("#DeleteFieldDialog_{$fid}").dialog("close");
});
});
- // Cancel
- $('#{$fid}_DeleteFieldCancel').click( function() {
- $("#{$fid}_DeleteFieldDialog").dialog("close");
- });
/*
- * New Picklist Option dialog box
+ * New Picklist Option Dialog
*/
// Setup
- $("#{$fid}_NewOptionDialog").dialog({
+ $("#NewOptionDialog_{$fid}").dialog({
autoOpen: false,
minWidth: 600,
dialogClass: "glm-dialog-no-close"
});
- // Display form and reset all input
- $('body').on('click', '.{$fid}_AddOptionButton', {$fid}_AddOptionButton);
- function {$fid}_AddOptionButton(e) {
- var {$fid}_fieldId = $(this).attr('data-fieldId');
+ // Cancel
+ $('body').on('click', '#NewOptionCancel_{$fid}', NewOptionCancel_{$fid});
+ function NewOptionCancel_{$fid}(e) {
+ $("#NewOptionDialog_{$fid}").dialog("close");
+ };
+
+ /*
+ * Add Field Option
+ */
+ $('body').on('click', '.AddOptionButton_{$fid}', addOptionButton_{$fid});
+ function addOptionButton_{$fid}(e) {
+ var fieldId_{$fid} = $(this).attr('data-fieldId');
- $("#{$fid}_NewOptionDialog").dialog("open");
- $('#{$fid}_NewOptionValue').val('');
- $('#{$fid}_NewOptionText').val('');
- $('#{$fid}_NewOptionDefault').removeAttr('checked');
- $('#{$fid}_NewOptionCost').val('');
+ $("#NewOptionDialog_{$fid}").dialog("open");
+ $('#NewOptionValue_{$fid}').val('');
+ $('#NewOptionText_{$fid}').val('');
+ $('#NewOptionDefault_{$fid}').removeAttr('checked');
+ $('#NewOptionCost_{$fid}').val('0.00');
- $('#{$fid}_NewOptionSubmit').data('data-fieldId', $(this).attr('data-fieldId'));
+ $('#NewOptionSubmit_{$fid}').data('data-fieldId', $(this).attr('data-fieldId'));
};
- // Submit form
- $('#{$fid}_NewOptionSubmit').click( function(e) {
+
+ /*
+ * Add New Option Submit
+ */
+ $('#NewOptionSubmit_{$fid}').click( function(e) {
// Collect the new field data
var formData = {
'action': 'glm_members_admin_ajax',
'glm_action': 'customFieldOptions',
'option': 'addNewOption',
- 'field_id': $('#{$fid}_NewOptionSubmit').data('data-fieldId'),
- 'option_value': $('#{$fid}_NewOptionValue').val(),
- 'option_text': $('#{$fid}_NewOptionText').val(),
- 'option_cost': $('#{$fid}_NewOptionCost').val(),
- 'option_default': $('#{$fid}_NewOptionDefault').is(':checked'),
+ 'field_id': $('#NewOptionSubmit_{$fid}').data('data-fieldId'),
+ 'option_value': $('#NewOptionValue_{$fid}').val(),
+ 'option_text': $('#NewOptionText_{$fid}').val(),
+ 'option_cost': $('#NewOptionCost_{$fid}').val(),
+ 'option_default': $('#NewOptionDefault_{$fid}').is(':checked'),
'fid': '{$fid}'
};
})
.done( function(optionHtml) {
if (optionHtml == '') {
- flashElement('{$fid}_NewFieldDialogError');
+ flashElement('FieldDialogError_{$fid}');
} else {
- var {$fid}_fieldId = $('#{$fid}_NewOptionSubmit').data('data-fieldId');
- $('#EndOfFieldOptions_'+{$fid}_fieldId).before(optionHtml);
- $("#{$fid}_NewOptionDialog").dialog("close");
+ var fieldId_{$fid} = $('#NewOptionSubmit_{$fid}').data('data-fieldId');
+ $('#PicklistOptions_'+fieldId_{$fid}).append(optionHtml);
+
+ $("#NewOptionDialog_{$fid}").dialog("close");
// Need to rebind delete option buttons
$('body').off('click', '.DeleteOptionButton_{$fid}', DeleteOptionButton_{$fid});
});
});
- // Cancel
- $('body').on('click', '#{$fid}_NewOptionCancel', {$fid}_NewOptionCancel);
- function {$fid}_NewOptionCancel(e) {
- $("#{$fid}_NewOptionDialog").dialog("close");
- };
+
// Delete
$('body').on('click', '.DeleteOptionButton_{$fid}', DeleteOptionButton_{$fid});
function DeleteOptionButton_{$fid}(e) {
- var {$fid}_optionDeleteId = $(this).attr('data-fieldOptionId');
+ var optionDeleteId_{$fid} = $(this).attr('data-fieldOptionId');
// Delete the selected option and remove it from the display
var formData = {
'action': 'glm_members_admin_ajax',
'glm_action': 'customFieldOptions',
'option': 'deleteOption',
- 'id': {$fid}_optionDeleteId,
+ 'id': optionDeleteId_{$fid},
'fid': '{$fid}'
};
$.ajax({
dataType: 'text'
})
.done( function(deleted) {
- $('#FieldOptionRow_' + {$fid}_optionDeleteId).remove();
+ $('#FieldOptionRow_' + optionDeleteId_{$fid}).remove();
});
};