$(function () { var $form_container_country = $("#form_container_country"), $form_input_name_country = $("#form_input_name_country"), $form_input_back_img_country = $("#form_input_back_img_country"), $form_input_welcome_message_country = $("#form_input_welcome_message_country"), $form_status_input_name_country = $("#form_status_input_name_country"), $modal_container_confirmation_country = $("#modal_container_confirmation"), $modal_button_submit_country = $("#modal_button_submit"); $modal_button_submit_country.click(function (e) { e.preventDefault(); $.ajax({ type: 'GET', url: '/api/addCountry', dataType: "jsonp", timeout: 30000, data: { table_name: "country", name_country: $form_input_name_country.val(), back_img_country: $form_input_back_img_country.val(), welcome_message_country: $form_input_welcome_message_country.val() }, beforeSend: function () { $modal_button_submit_country.html(''); } }).done(function (data) { if (data.status === "success") { $.notify({ icon: "notifications", message: "Save completed." }, { type: 'success', timer: 200, placement: { from: "top", align: "center" } }); $form_input_name_country.val(null); $form_input_back_img_country.val(null); $form_input_welcome_message_country.val(null); $form_input_name_country.parent().removeClass("has-success"); $form_input_name_country.parent().removeClass("has-warning"); $form_status_input_name_country.removeClass("text-warning"); $form_status_input_name_country.removeClass("text-success"); $form_status_input_name_country.addClass("text-primary"); $form_status_input_name_country.html(''); } else { $.notify({ icon: "notifications", message: "Save failed." }, { type: 'danger', timer: 200, placement: { from: "top", align: "center" } }); } }).always(function () { $modal_button_submit_country.html('Save'); $modal_container_confirmation_country.modal('hide'); }); }); $form_input_name_country.focusout(function () { if ($form_input_name_country.val() !== "") { $form_status_input_name_country.html(''); $.ajax({ type: 'GET', url: '/api/checkCountryName', dataType: "jsonp", timeout: 30000, data: { table_name: "country", q: $form_input_name_country.val() }, beforeSend: function () { $form_status_input_name_country.html(''); } }).done(function (data) { if (data.exist !== false) { $.notify({ icon: "notifications", message: "Country Already Exist in Database." }, { type: 'warning', timer: 200, placement: { from: "top", align: "center" } }); $form_input_name_country.val(null); $form_input_name_country.parent().removeClass("has-success"); $form_input_name_country.parent().addClass("has-warning"); $form_status_input_name_country.removeClass("text-primary"); $form_status_input_name_country.removeClass("text-success"); $form_status_input_name_country.addClass("text-warning"); $form_status_input_name_country.html('Country Already Exist in Database'); } else { $form_input_name_country.parent().removeClass("has-warning"); $form_status_input_name_country.removeClass("text-warning"); $form_status_input_name_country.removeClass("text-primary"); $form_status_input_name_country.addClass("text-success"); $form_input_name_country.parent().addClass("has-success"); $form_status_input_name_country.html('Country Name Valid'); } }); } else { $form_input_name_country.parent().removeClass("has-success"); $form_input_name_country.parent().removeClass("has-warning"); $form_status_input_name_country.removeClass("text-warning"); $form_status_input_name_country.removeClass("text-success"); $form_status_input_name_country.addClass("text-primary"); $form_status_input_name_country.html(''); } }); $form_container_country.submit(function (e) { e.preventDefault(); if ($form_input_name_country.val() !== "") { $modal_container_confirmation_country.modal('show'); } else { $.notify({ icon: "notifications", message: "Please fill the required field." }, { type: 'warning', timer: 200, placement: { from: "top", align: "center" } }); } }); $modal_container_confirmation_country.on('show.bs.modal', function (event) { var button = $(event.relatedTarget); // Button that triggered the modal // If necessary, you could initiate an AJAX request here (and then do the updating in a callback). // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead. var html = ''; var modal = $(this); html += '
Country Name : ' + $form_input_name_country.val() + '
'; html += 'Background Image : ' + $form_input_back_img_country.val() + '
'; html += 'Welcome Message : ' + $form_input_welcome_message_country.val() + '
'; modal.find('.modal-body').html(html); }); });