dropdown list and ajax load notifications
i have a dropdown list that if select every item of this dropdown we have a ajax call that load a php file with this
begin of ajax call for loading php file
- $(document).on('change','[id^=vijegi]',function(e){ e.preventDefault();
and php file echo
- echo'<input id="title" class="onvan" type="input" class="form-control" value='.$postvijegi.' placeholder="Enter a title ..."/>
- <input id="message" class="pay" type="input" class="form-control" value='.$postvijegi.' placeholder="Enter a title ..."/>
- <div id="mokh"></div>';
now that two input value use in this file
- var UIToastr = function () {
- return {
- //main function to initiate the module
- initok: function () {
- var i = -1,
- toastCount = 0,
- $toastlast,
- getMessage = function () {
- var msgs = $('#message').val();
-
-
- return msgs;
- };
- $(document).on('change',"[name=posvijegi]",function(){
- });
-
- $(document).on('DOMNodeInserted', '#mokh',function(e){
- e.preventDefault();
- var shortCutFunction = 'info';
- var msgs = $('#message').val();
- var title = $('#title').val() || '';
- var $showDuration = $('#showDuration');
-
- var $hideDuration = $('#hideDuration');
- var $timeOut = $('#timeOut');
-
- var $extendedTimeOut = $('#extendedTimeOut');
- var $showEasing = $('#showEasing');
- var $hideEasing = $('#hideEasing');
- var $showMethod = $('#showMethod');
- var $hideMethod = $('#hideMethod');
- var toastIndex = toastCount++;
- toastr.options = {
- closeButton: 'checked',
-
- positionClass:'toast-bottom-center',
- onclick: null
- };
- if ($('#addBehaviorOnToastClick').prop('checked')) {
- toastr.options.onclick = function () {
- alert('You can perform some custom action after a toast goes away');
- };
- }
-
- toastr.options.showDuration =600;
-
-
- toastr.options.hideDuration = 1000;
-
-
- toastr.options.timeOut = 10000;
-
-
- toastr.options.extendedTimeOut =1000;
-
- toastr.options.showEasing = 'swing';
-
-
- toastr.options.hideEasing = 'linear';
-
- toastr.options.showMethod = 'fadeIn';
-
-
- toastr.options.hideMethod = 'fadeOut';
-
-
- msg = getMessage();
-
- $("#toastrOptions").text("Command: toastr[" + shortCutFunction + "](\"" + msg + (title ? "\", \"" + title : '') + "\")\n\ntoastr.options = " + JSON.stringify(toastr.options, null, 2));
- $( "#mokh" ).empty();
- var $toast = toastr[shortCutFunction](msg, title); // Wire up an event handler to a button in the toast, if it exists
-
- if ($toast.find('#okBtn').length) {
- $toast.delegate('#okBtn', 'click', function () {
- alert('you clicked me. i was toast #' + toastIndex + '. goodbye!');
- $toast.remove();
- });
- }
- if ($toast.find('#surpriseBtn').length) {
- $toast.delegate('#surpriseBtn', 'click', function () {
- alert('Surprise! you clicked me. i was toast #' + toastIndex + '. You could perform an action here.');
- });
- }
- $('#clearlasttoast').click(function () {
- toastr.clear($toastlast);
- });
- });
- $('#cleartoasts').click(function () {
- toastr.clear();
- });
- }
- };
-
- }();
my problem is here that for first that i click on dropdown item i have one (selected item)
Toastr Notifications
but when i select The second item of dropdown without refresh page i have two (selected item + Previous selection)
Toastr Notifications
means when i select every item toastr notifications show previos item that i selected
as see in above pic we must have just last selected item , but we have from first selected item to last
how i can fix this?