Category: javascript

I’m trying to think of an infrastructure architecture to implement and use on my application.
Basically I have a page with multiple components.
enter image description here

the filters and filter options are fetched from an API like this:

const filter1 = [
  {
    id: "id",
    name: "OPTION 1",
  },
  {
    id: "id2",
    name: "OPTION 2",
  },
];

The below components needs to send an API request each of them with the filters selected.

The initial components request needs to be done only when the filters and their defaults value are set so that the API request to get the component data will be with the correct filters.

So far I tried to think about ContextProvider which will store all of my filters state, and then all of the components using it will use the context and the state to make an API call.

But there are still a few problems with it,
1: I need to think of a way to set all of the filters default values both in the ContextProvider and in the filter state to present the default value selected.
2. I need to prevent the components from performing an API request until all of the default values are populated in the ContextProvider and shown in the filters.

the default values also needs to come from the API.

Am I even thinking about it the right way?
What am I missing to make it sensible and easy to code?

I am getting my file from firebase server by

getBlob(ref(this.str, `xxx.xx`)); // returns Promise<Blob>

but just calling it directly, it will get downloaded as an internal file

How do I do it so that it gets download externally

I tried to make simple chat app using the PHP & JavaScript, tried to retrieve chat data from PHP but when I run the code it not passing in JavaScript. It didn’t load the data. Can anyone help?

Javascript

const form = document.querySelector(".typing-area"),
incoming_id = form.querySelector(".incoming_id").value,
inputField = form.querySelector(".form-control"),
sendBtn = form.querySelector("button"),
chatBox = document.querySelector(".direct-chat-messages");

setInterval(() =>{
    let xhr = new XMLHttpRequest();
    xhr.open("POST", "../module/chat/get-chat.php", true);
    xhr.onload = ()=>{
      if(xhr.readyState === XMLHttpRequest.DONE){
          if(xhr.status === 200){
            let data = xhr.response;
            chatBox.innerHTML = data;
            if(!chatBox.classList.contains("active")){
                scrollToBottom();
              }
          }
      }
    }
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send("incoming_id="+incoming_id);
}, 500);

DIV to load the chat data

<div class="direct-chat-messages">
               
</div>

I am creating application using angular, in my app, i am redirecting to external url with post some data, but during redirection url is changes in the browser tab but it shows the previous page for some seconds. Below is the code:

          const myform = document.createElement('form');
          const mapInput = document.createElement('input');
          myform.method = 'POST';
          myform.action = url;
          myform.style.display = 'none';
          mapInput.name = 'token';
          mapInput.value = tokedata;
          myform.appendChild(mapInput);
          document.body.appendChild(myform);
          myform.submit();

I need quick redirection to external url

So i have a count button which disabled for two hours lets say 1am to 3am.
I want to reset counter when the button is enabled again.

For example.

I have a counter which has 40 counts right now .the time is 1am and counter button is disabled for two hours it will enable on 3am. So i want when counter button is enabled on 3am counts should be zero after 3 am.

I hope you get what i am trying to say.
I will try to explain once more.
Right now time is 12am and the counts are 40. Now time is 1am and now count button is disabled for two hours .at 3am count button is enabled so at this point of time i want my counts to be zero.

Here is my java code for counter.

            @Override
            public void onClick(View v) {
                int hours = new Time(System.currentTimeMillis ()).getHours();
                if(hours == 23 || hours == 24||hours == 01){
                    //Disable
                }else{
                    //Enable
                    count10counter++;
                }
                count10.saveTotalInPrefcount10 ( getApplicationContext (),count10counter );
                tvcount10.setText ( Integer.toString ( count10counter ) );
                Toast.makeText ( getApplicationContext (),"you clicked 10",Toast.LENGTH_SHORT ).show ();
            }
        } );  ```






I also have reset button but that reset button can be clicked by every user and i dont want.only i or admin should be able to click reset button.if someone has any suggestions on this please suggest me.

``` RESET.setOnClickListener ( new View.OnClickListener ( ) {
           @Override
           public void onClick(View arg0) {

               count10counter=0;
               tvcount10.setText ( String.valueOf ( count10counter ) );

           }
       } );```

i have a script that replaces a text result value and modifys the css depending on what is displayed

Jquery:

setInterval(function() {
    $('.monthappend').each(function() {
        var text = $(this).text();
        $(this).text(text.replace('$0', 'CUSTOM'));

        if ($(this).text() == 'CUSTOM') {
            $('.monthappend').addClass('without-after-element');
        } else {
            $(this).removeClass("without-after-element")
        }
    });
}, 1000);

HTML:

<div id="s0r16c4" class="monthappend"></div>

Currently on my site the function works for most with the class set except one.
Example link

Im not really sure what is going wrong with it but i can see on inspector that the function does not fire off on it, to test the error input 1000 on the first input field. Im hoping someone out there can help.

Thank you!

This is the code i have used for redirection.

It is redirecting to

http://localhost:3000/something/https://example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies

instead of

https://example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies

<Link
  to={{
    pathname:
      "https://example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies"
  }}
  target="_blank"
>
  <Button variant="contained" className="py-1 px-2">
    <i className="ri-upload-2-line pe-2"></i> Apply
  </Button>
</Link>

So I’m trying to import local JSON file to my nuxt app and display it but the size of the file is really big (400mb) and the app keeps crashing or the website won’t load at all.

I already tried using another smaller JSON file and it worked perfectly.The memory used when loading the app went from 250mb to 4gb so i thought the problem would probably be because the JSON is too big.

Is there any way i can reduce it s size or make the app load the file ? (I’ve seen some similar issues that suggested lazy loading the component that imports the json but i’m not sure if that really can help)
Here’s my import

<script>
import Repdata from "../report/report1.json"
export default {
  data() {
    return {
      Rep: Repdata
    };

}}
</script>

I’m trying to check if an image url is valid before setting in my img src. At the moment this is what I have:

function checkURL(url) {
    var img = new Image();
    
    img.onerror = function () {
        return false;
    }

    img.onload = function () {
        return true;
    }

    img.src = url;
}

In both cases is returning undefined instead of true/false.

What can I do to solve my issue? I’m using jQuery 3.6.0.

I have a SOAP Service I need to consume. They authorize by using WS-Security. I was able to configure SoapUI like this:

The problem is that I have no idea how to implement this in Javascript. Could maybe someone put me into the right direction?

Halp is highly appreciated 🙂

Can anybody suggest How to resize the table column header in java script. I want to resize the table column for user friendly to see the data.

Thanks

How can I resolve this audit issue that I’m getting?

I want to send an unique constraint, which unfortunately looks like an URL.
My unique constraint string looks like this:
http://192.168.1.1:8086/testOrg/testBucket

I pass this UC in the query param of a delete request:
https://localhost:5001/api/settings?uc=https://192.168.1.1:8086/testOrg/testBucket

The crazy thing, which i do not understand is the fact, that the URL of the UC changed from “http” to “https“.

I tried to add letters in front of the UC, e.g. UChttp://192.168.1.1:8086/testOrg/testBucket but event this changed to “https“.

I have a variable called ‘bullet’ and I want set frames when another variable ‘villan shoots it.
I tried using frame Count, set frame but none is working

I have both. Node.js and VS code extention development. But VS code still shows I have neither of them. Why