Skip to content

Commit

Permalink
adding new callbacks
Browse files Browse the repository at this point in the history 
- when form is loaded
- when saving
- when saved

also fixed a bug with required
  • Loading branch information
@nodren
nodren committed Feb 9, 2014
1 parent fd3e0ed commit 578f0b5
Showing 1 changed file with 27 additions and 16 deletions.
43 changes: 27 additions & 16 deletions js/jquery.formbuilder.js
View file
Expand Up @@ -37,7 +37,10 @@
hide : "Hide",
required : "Required",
show : "Show"
}
},
loaded: function() {},
saving: function() {},
saved: function() {}
};
var opts = $.extend(defaults, options);
var frmb_id = 'frmb-' + $('ul[id^=frmb-]').length++;
Expand All @@ -51,25 +54,29 @@
$.getJSON(opts.load_url, function(json) {
form_db_id = json.form_id;
fromJson(json.form_structure);
opts.loaded(json);
var controlBox = setupControlBox(opts.control_box_target);
});
} else {
var controlBox = setupControlBox(opts.control_box_target);
}
// Create form control select box and add into the editor
var controlBox = function (target) {
var setupControlBox = function (target) {
var select = '';
var box_content = '';
var save_button = '';
var box_id = frmb_id + '-control-box';
var save_id = frmb_id + '-save-button';
// Add the available options
select += '<option value="0">' + opts.messages.add_new_field + '</option>';
select += '<option value="0" disabled selected>' + opts.messages.add_new_field + '</option>';
select += '<option value="input_text">' + opts.messages.text + '</option>';
select += '<option value="textarea">' + opts.messages.paragraph + '</option>';
select += '<option value="checkbox">' + opts.messages.checkboxes + '</option>';
select += '<option value="radio">' + opts.messages.radio + '</option>';
select += '<option value="select">' + opts.messages.select + '</option>';
// Build the control box and search button content
box_content = '<select id="' + box_id + '" class="frmb-control">' + select + '</select>';
save_button = '<input type="submit" id="' + save_id + '" class="frmb-submit" value="' + opts.messages.save + '"/>';
box_content = '<select id="' + box_id + '" class="frmb-control form-control">' + select + '</select>';
save_button = '<button type="submit" id="' + save_id + '" class="frmb-submit btn btn-primary">' + opts.messages.save + '</button>';
// Insert the control box into page
if (!target) {
$(ul_obj).before(box_content);
Expand All @@ -80,7 +87,8 @@
$(ul_obj).after(save_button);
// Set the form save action
$('#' + save_id).click(function () {
save();
opts.saving.call(this);
save.call(this);
return false;
});
// Add a callback to the select element
Expand All @@ -93,7 +101,7 @@
}, 500);
return false;
});
}(opts.control_box_target);
};
// Json parser to build the form builder
var fromJson = function (json) {
var values = '';
Expand Down Expand Up @@ -158,14 +166,14 @@
// single line input type="text"
var appendTextInput = function (values, required) {
field += '<label>' + opts.messages.label + '</label>';
field += '<input class="fld-title" id="title-' + last_id + '" type="text" value="' + values + '" />';
field += '<input class="fld-title form-control" id="title-' + last_id + '" type="text" value="' + values + '" />';
help = '';
appendFieldLi(opts.messages.text, field, required, help);
};
// multi-line textarea
var appendTextarea = function (values, required) {
field += '<label>' + opts.messages.label + '</label>';
field += '<input type="text" value="' + values + '" />';
field += '<input type="text" class="form-control" value="' + values + '" />';
help = '';
appendFieldLi(opts.messages.paragraph_field, field, required, help);
};
Expand All @@ -177,7 +185,7 @@
}
field += '<div class="chk_group">';
field += '<div class="frm-fld"><label>' + opts.messages.title + '</label>';
field += '<input type="text" name="title" value="' + title + '" /></div>';
field += '<input type="text" name="title" class="form-control" value="' + title + '" /></div>';
field += '<div class="false-label">' + opts.messages.select_options + '</div>';
field += '<div class="fields">';

Expand Down Expand Up @@ -212,7 +220,7 @@
field = '<li>';
field += '<div>';
field += '<input type="checkbox"' + (checked ? ' checked="checked"' : '') + ' />';
field += '<input type="text" value="' + value + '" />';
field += '<input type="text" class="form-control" value="' + value + '" />';
field += '<a href="#" class="remove" title="' + opts.messages.remove_message + '">' + opts.messages.remove + '</a>';
field += '</div></li>';
return field;
Expand All @@ -225,7 +233,7 @@
}
field += '<div class="rd_group">';
field += '<div class="frm-fld"><label>' + opts.messages.title + '</label>';
field += '<input type="text" name="title" value="' + title + '" /></div>';
field += '<input type="text" class="form-control" name="title" value="' + title + '" /></div>';
field += '<div class="false-label">' + opts.messages.select_options + '</div>';
field += '<div class="fields">';

Expand Down Expand Up @@ -260,7 +268,7 @@
field = '<li>';
field += '<div>';
field += '<input type="radio"' + (checked ? ' checked="checked"' : '') + ' name="radio_' + name + '" />';
field += '<input type="text" value="' + value + '" />';
field += '<input type="text" class="form-control" value="' + value + '" />';
field += '<a href="#" class="remove" title="' + opts.messages.remove_message + '">' + opts.messages.remove + '</a>';
field += '</div></li>';

Expand All @@ -276,7 +284,7 @@
}
field += '<div class="opt_group">';
field += '<div class="frm-fld"><label>' + opts.messages.title + '</label>';
field += '<input type="text" name="title" value="' + title + '" /></div>';
field += '<input type="text" class="form-control" name="title" value="' + title + '" /></div>';
field += '';
field += '<div class="false-label">' + opts.messages.select_options + '</div>';
field += '<div class="fields">';
Expand Down Expand Up @@ -315,7 +323,7 @@
// Appends the new field markup to the editor
var appendFieldLi = function (title, field_html, required, help) {
if (required) {
required = required === 'checked' ? true : false;
required = required === 'true' ? true : false;
}
var li = '';
li += '<li id="frm-' + last_id + '-item" class="' + field_type + '">';
Expand Down Expand Up @@ -402,14 +410,17 @@
});
// saves the serialized data to the server
var save = function () {
var self = this;
if (opts.save_url) {
$.ajax({
type: "POST",
url: opts.save_url,
data: $(ul_obj).serializeFormList({
prepend: opts.serialize_prefix
}) + "&form_id=" + form_db_id,
success: function () {}
success: function () {
opts.saved.call(self);
}
});
}
};
Expand Down

0 comments on commit 578f0b5

Please sign in to comment.