Refreshing modal content following successful AJAX call

Does anyone know how to fix this issue in my code? I need to reload a modal for another database query after a successful operation

if(result === 'success'){
  $("#editarModalOcup").modal('hide');
  $('#success .modal-body').html('Information: ' + data.message);
  $('#success').modal('show');
  $('#success').on('hidden.bs.modal', function () {
    /*$('#editarModalOcup').on('hidden.bs.modal', function() {
        $(this).removeData('bs.modal');
     });
     $("#editarModalOcup").modal('show');*/
  });
}

However, this code is not working as expected and the button shows a forbidden signal preventing me from using it. Any suggestions?

Thank you!

UPDATE HTML Modal:

<div class="modal fade" id="editarModalOcup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header modal-header-success">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3><i class="fa fa-pencil-square-o"></i> Edit Occupancy Room</h3>
        </div>
        <div class="modal-body">
            <!-- The form is placed inside the body of modal -->
            <form id="editarOcupacao" method="post">
                <div class="form-group">
                    <input type="hidden" name="edit_ocupacao" id="edit_ocupacao">
                </div>
                <div class="form-group">
                    <input type="hidden" name="edit_dia" id="edit_dia">
                </div>
                <div class="form-group">
                    <input type="hidden" name="edit_tempo" id="edit_tempo">
                </div>
                <div class="form-group">
                    <label for="recipient-name" class="control-label">Room:</label>
                    <input class="form-control" name="edit_sala_nome" id="edit_sala_nome" disabled="true">
                </div>
                 <!-- More form fields here -->
          </form>
        </div>
    </div>
</div>

Answer №1

If you encounter a similar issue, Simply utilize formvalidation like so:

 $('#modal').display().formValidation('clearForm');

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Converting "require" to ES6 "import/export" syntax for Node modules

Looking to utilize the pokedex-promise for a pokemonapi, however, the documentation only provides examples on how to require it in vanilla JavaScript: npm install pokedex-promise-v2 --save var Pokedex = require('pokedex-promise-v2'); var P = new ...

Slice or eliminate the PlaneGeometry using XY coordinates

Just starting out in learning Three.js and looking to achieve the following: const customPlaneGeometry = new THREE.PlaneGeometry( width, height, widthSegments, heightSegments ); if(customPlaneGeometry.x > 2 && customPlaneGeometr ...

Using JavaScript to show content in a textarea field

In my index.jsp file, I have implemented the following code to populate two textareas, INPUT_TEXT and INPUT_TEXT2, with processed data. This involves passing the text through a servlet, a Java class, and finally displaying the preprocessed results in the s ...

Tips for applying the timeout attribute in a jQuery AJAX request when using the post method

Behold the function below: function mark_unmark_user_answer(targ, answer, answer_id, test_id, test_type, question_no, module_url) { if(checked==targ){ targ.checked=false; checked=false; } else { checked=targ; } $.post(module_url, ...

What makes fastify-plugin better than simply calling a regular function?

I recently came across a detailed explanation of how fastify-plugin operates and its functionality. Despite understanding the concept, I am left with a lingering question; what sets it apart from a standard function call without using the .register() metho ...

What is the best way to test an externally hosted application with Testacular and AngularJS?

I have a Pyramid app running on http://localhost:6543. This app serves the AngularJS app at /. This app utilizes socket.io. The query is: Can I test this application using these tools? In my scenario.js file, I have the following: beforeEach(function( ...

Interactive image slideshow with custom tagging capabilities

Is there a ready-made open-source horizontal gallery slider package available that includes photo-tagging functionality using JavaScript and jQuery, suitable for use in personal portfolios? ...

I am having success posting data through a form, however, the fetch API is not functioning as expected for me

Currently, I am working on a React Project and focusing on creating a signup form. Everything seems to be fine when posting form data using the Form, but things get stuck when I try to use onSubmit={handleSubmit} along with fetch APIs such as axios or just ...

Is there a way to speed up this sorting function?

Currently, I am sifting through approximately 12,000 users, which amounts to over 1,000 each day. I am using MongoDB with monk and have implemented the following sorting code. class User { constructor(doc) { this.username = doc.username this.kills ...

Can one window interact with the window that opened it?

I am developing an application that requires users to log in using their Reddit account. Once they accept, a new window called SpawnedWindow opens, prompting users to connect with Reddit. Upon successfully connecting, SpawnedWindow redirects to a specific ...

Encountering 404 error while executing a Python script through an HTML button on a Google App Engine hosted

I have created an html page called custom.html, and a python script named test.py (both shown in the screenshots below). The html page consists of a button that is intended to trigger the python script to print a line. In my future Python scripts, I plan t ...

Is there a way to convert c# code into javascript?

HttpCookie newCookie = Request.Cookies["cookie1"]; int count = (newCookie .Values.Keys.Count) / 6; int keyCount = (newCookie .Values.Keys.Count); string val = HttpUtility.UrlDecode(newCookie .Values.GetKey(i).ToString()); string str = newCookie .Value ...

Generating permanent URLs for jquery and PHP

I am currently working on a website that utilizes jquery and php to dynamically post content. One thing I'm struggling with is figuring out how to generate permalinks for the site. I have an example link at www.eataustineat.com, but I want to create d ...

String casting for large JavaScript integers may require rounding to function properly

When trying to pass a large integer to a function from an onclick event in HTML, I always encounter issues with rounding. Despite using bigInt libraries, I still struggle to pass the full number accurately and would prefer a simple string casting method. ...

Tips for utilizing the @Input directive within the <router-outlet></router-outlet> component

I am new to Angular 4 and recently discovered that in Angular, data can be passed from a parent component to a child component using @Input like this: <child [dataToPass]="test"></child> My question is, how can I achieve the same functionalit ...

Variation in functionality of onclick in javascript

Can you identify the distinction between the two primary lines of JavaScript in this example? HTML: <html> <body> <form> <input type="button" value="one" id="one" /> <input type="button" v ...

Website experiencing issues with moderating Facebook comments

I recently added a Facebook comments box to my website in the footer. Although it is visible, I am unable to moderate it. Furthermore, the comments are not showing up in the comments queue panel at https://developers.facebook.com/tools/comments. I am us ...

Why isn't PHP receiving the parameter passed through the URL?

When it comes to creating the table and passing data using ajax, I encountered an issue. Despite putting the parameter in the URL in my ajax script, the php code failed to read it. $.ajax({ type:"POST", url:"system_setting.php?p=add", ...

Adding a CSS class to a Vue component with a custom prop

I am looking to create a custom component in Vue that has the following props: text = the text to display in the link. icon = the identifier of the icon to display next to the link. < sidebar-link text="Home" icon="fa-home"> Below is the .Vue ...

Unable to delete React element by ID as it is undefined

Having some trouble deleting an item by ID with React. Despite the backend routes functioning properly (node and postgresql), every attempt to delete an item results in it reappearing upon page refresh. The command line indicates that the item being delete ...