Reload Popup Box

I am currently developing a website using Django and I am in need of a popup window that can display logging messages and automatically refresh itself every N seconds. In order to achieve this, I am utilizing the standard Python logger, JavaScript, and Dajaxice for handling popups.

However, I have encountered a challenge in getting the popup to refresh automatically while utilizing the log file content retrieved within the Dajaxice function.

The code snippet from my ajax.py is as follows:

import json, SIMPLCode, logging, os, sys
from dajaxice.decorators import dajaxice_register

@dajaxice_register(method='GET')
def getLogs(request):
  fname = "SIMPLCode/Logs/LOG_2015-07-08.log"
  with open(fname,"r") as f:
    lines = f.readlines()
  lines = lines[-10:]
  return json.dumps({'logLines':lines})

This is what my proposed Django HTML markup looks like:

<button class="btn btn-primary" onclick="Dajaxice.InterfaceApp.getLogs(popitup())">{% bootstrap_icon "share-alt" %} View Log File </button>

Below is the sample JS code for reference:

function popitup(data) {
    $(document).ready(function(data) {
      var log_file = data.logLines;
      var newwindow=window.open('','Log Viewer','height=300,width=500');
      newwindow.write(log_file)
    });

    if(newwindow && !newwindow.closed){
      newwindow.location.reload(true); 
      newwindow.focus();
    } 
  }

Although, upon implementing the above solution, I encountered an error stating that the data from my dajaxice function is not defined:

Uncaught TypeError: Cannot read property 'logLines' of undefined

Interestingly, when I simplified things and used an alert window it worked fine:

<input id="LogMessages" type="button" value="View Log Messages" onclick="Dajaxice.InterfaceApp.getLogs(function(d){alert(d.message);})"/>

Given my limited experience with JS and dajaxice, I am finding it challenging to find resources online. Any assistance or guidance on resolving this issue would be greatly appreciated!

Answer №1

The issue arose from my method of calling it. The accurate way to do it is as follows:

<button class="btn btn-primary" onclick="Dajaxice.InterfaceApp.getLogs(popitup)">{% bootstrap_icon "share-alt" %} View Log File </button>

It was incorrect to have () after the call to popitup

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

Handlers for adjustments not correctly updating values in introduced object

I am facing an issue with a table that displays data fetched from an API and a select dropdown. Whenever a checkbox is selected, the name key along with its value is added to an array object named selectedFields. checkbox = ({ name, isChecked }) => { ...

Creating phony passwords effortlessly in JavaScript utilizing the informal library

I am trying to create a password that meets the following criteria: Minimum length: 7 Maximum length: 15 At least one uppercase letter At least one lowercase letter Special characters: ~ ! @ # $ % ^ * ( ) _ + ? I have been using the casual library for g ...

Obtaining HTML response from ActionResult within a Controller

I am currently working on incorporating a feature that closely resembles the Related Questions section found on StackOverflow, and I am approaching this task within MVC. $().ready(function() { var s = $("#Summary").val(); $("#Summary").blur(function ...

Problem with Marionette AppRouter compatibility when used with Browserify

app.js module.exports = function () { if (!window.__medicineManager) { var Backbone = require('backbone'); var Marionette = require('backbone.marionette'); var MedicineManager = new Marionette.Application(); Medicin ...

Tips for managing @ManyToMany relationships in TypeORM

In this scenario, there are two distinct entities known as Article and Classification, linked together by a relationship of @ManyToMany. The main inquiry here is: How can one persist this relationship effectively? The provided code snippets showcase the ...

Unable to display the column data labels in Highcharts due to the incorrect formatting being presented

I'm having trouble displaying the datetime format at the top of a column in my chart. Although the tooltip shows the correct data when hovering over the columns, the labels are not formatted properly. Received output - 86340000 Expected output - 23: ...

Can someone explain what logForm.$invalid.$setValidity is all about?

The code snippet can be found here I am a beginner in this field and currently studying a piece of code. I am having trouble understanding the logForm.$invalid.$setValidity line. I have searched online but couldn't find any information about it. The ...

The outcome of a MySQL query involving JSON_OBJECT() is a string value

I have crafted a query that extracts posts from a table and includes information about each post's author: SELECT post.id, post.text, post.datetime, JSON_OBJECT( 'username', user.username, 'firstName', user.firstName, 'last ...

text within the table is overlapping when being created dynamically in the <table> using javascript and jquery.quickflip.js

Hello everyone, I am currently working on dynamically generating a table using tabs created with jquery.quickflip.js. However, I have run into an issue where the text from one tab may overwrite values in another tab when switching between them. Below is ...

Issues encountered with certain Tailwind styles functioning improperly when deployed in a production environment with Next.js

It seems that there are some style issues occurring in the production build hosted on Netlify for a specific component. The problematic component is a wrapper located at ./layout/FormLayout.tsx. Below is the code for this wrapper: const FormLayout: React.F ...

Even though my form allows submission of invalid data, my validation process remains effective and accurate

Here is the code I have written: <!doctype html> <html lang="en"> <head> <title>Testing form input</title> <style type="text/css></style> <script type="text/javascript" src="validation.js"></script> &l ...

Tips for maintaining a scrollable Material-UI Table with dynamic height?

I'm encountering an issue with the Material-UI Table component in terms of its size and scrollability. Summary: The Material-UI table only becomes scrollable when its parent has a fixed size. If I set the size to 100% to fit the parent, it overflows. ...

The loading indicator fails to show up when users navigate between pages that have already been loaded in NextJS and ReactJS

What do I need: I am seeking a way to show a loading indicator whenever a user switches between pages on my website. After discovering an effective example at https://github.com/zeit/next.js/tree/canary/examples/with-loading, I implemented a similar appro ...

A guide on accessing JSON files from a Cosmos DB container using Python scripts

I need to retrieve a JSON file from the container, make changes to it, and save it back in JSON format. I have read-only access to Cosmos DB. Here is an image of Cosmos DB: https://i.stack.imgur.com/SWSdz.jpg I encountered the following error: CosmosRes ...

Creating images with LibCanvas

Currently, I am utilizing LibCanvas for canvas drawing on my HTML page. However, I am facing difficulty in drawing an image. Can someone provide assistance with this? UPDATE: The code snippet I am using is showing the image being drawn but then it disappe ...

The function error is currently in a waiting state as it already includes an

I encountered a particular issue that states: "await is only valid in async function." Here is the code snippet where the error occurs: async function solve(){ var requestUrl = "url"; $.ajax({url: "requestUrl", succes ...

Is there a way to deactivate the click function in ngx-quill editor for angular when it is empty?

In the following ngx-quill editor, users can input text that will be displayed when a click button is pressed. However, there is an issue I am currently facing: I am able to click the button even if no text has been entered, and this behavior continues li ...

Setting up web pack with flag-icon-css integration

I have successfully set up a webpack project using https://github.com/teroauralinna/webpack-guide. Now, I am looking to integrate https://github.com/lipis/flag-icon-css into my project. To do so, I followed these steps: npm install flag-icon-css --save T ...

Managing the re-triggering of a function within useEffect upon the user clicking the "Back Button" in a React application

Is there a way to prevent the loadUserPosts() function from being called again when the user clicks the 'back button' on their browser? It seems like the isLogged useState is being changed when the back button is clicked. The loadUserPosts funct ...

Configuring Tailwind CSS with PostCSS in a Nuxt project

Error Message "In order to avoid issues with features like alias resolving inside your CSS, please make sure to use build.postcss in your nuxt.config.js file instead of an external configuration file. Support for external config files will be depreca ...