Category: javascript

I am trying to disable click outside the confirm message in JS. Is there any simple solution for this issue? If the confirm message show up on mobile, and i click outside of it.. it will dissapear, but i need it to stay as it is.

 if (confirm("Are u sure?")) {
    
 }

I want to delete a document automatically after 10 seconds of creating It , but I don’t know why my code doesn’t works (Document not deleted after 10 seconds)

const timestamp = new Date().getTime()

await db.collection("admin_msg").insertOne({createdAt : timestamp , expiresIn : timestamp + 10000 });
await db.collection("admin_msg").createIndex({ expireAt: 1}, { expireAfterSeconds: 10 });

So what I expected from the code below was that when I get any errors in the request it would do a catch exception, but that is not happening, can anyone help me?

      try {

        const user = UsersServices.register({name: name, email: email, password: password})
        redirectToLogin(true)
      } catch (err) {
        setError(true)
      }

This is the POST I’m using

register: params => Api.post('users/register', params)

I want to call a javascript function from MainActivity.java in android studio which will set filename in localstorage to use it later. But without any webview call.
This is the structure of my project

Please suggest the best option. Thanks in advance.

Hello I am new and learning ReactJS. I am writing the code for matching the model text from my code to firebase Realtime database model text. The problem i got in this is I have store my model text in state and define it like this var modelTxt = this.state.models. and write my firebase database query like this. and import it like this import { getDatabase, ref, get, orderByChild } from "firebase/database";

my database structure is like this :

{
070921210001{
"Model": "modelName"
}
}

My code

var modelTxt = this.state.models
console.log(modelTxt)

 const dbRef = ref(getDatabase("/"));
 get(orderByChild(dbRef, `{"Model"}`)).equalTo(modelTxt).once("value", function (snapshot) {
            if (snapshot.exists()) {
              console.log(snapshot.val());
            } else {
              console.log("No data available");
            }
          })
            .catch((error) => {
              console.error(error);
            });

I am a beginner in this field. just try to do a small project using vue.js.
I wanted to give an option to users to download their Vue.js to-do list. I have had imported the jspdf library and Html2canvas.
This is what I got as an output.but I want my output like this. (this is the output of my code in the local browser.try to find out my mistake here.

~my script method()here.

  download() {
   const doc = new jsPDF();
   const width = doc.internal.pageSize.getWidth();
   const height = doc.internal.pageSize.getHeight();
   /** WITH CSS */
   var canvasElement = document.createElement('canvas');
    html2canvas(this.$refs.content, { canvas: canvasElement 
      }).then(function (canvas)
       {
    const img = canvas.toDataURL("image/jpeg", 0.8);
    doc.addImage(img,'JPEG',20,20 , width, height);
    doc.save("sample.pdf");
   });
   },

My Vue component code here

<template>
<button @click="download">Download PDF WITH CSS</button>
  <div ref="content">
  <div class="container">
    <h2 class="text-center at-5">My Destinations</h2>
    <!-- input -->
    <div class="d-flex">

      
        <input v-model="task" type="text" placeholder="Enter Destination" class="form-control">
        <button @click="submitTask" class="btn btn-warning rounded-0">SUBMIT</button>

    </div>
  <table class="table table-bordered mt-5" id="tabalo">
  <thead>
    <tr>
      <th scope="col" style="background-color:#33FDFF">Location</th>
      <th scope="col" style="background-color:#33FDFF">Status</th>
      <th scope="col" style="background-color:#33FDFF" class="text-center">#</th>
      <th scope="col" style="background-color:#33FDFF" class="text-center">#</th>
    </tr>
  </thead>
  <tbody style="background-color:#B895DE">
    <tr v-for="(task, index) in tasks" :key="index">
      <td>
        <span :class="{'visited': task.status === 'visited'}">{{task.name}}</span>
      </td>
      <td style = "width:100px">
        <span @click="changeStatus(index)" class="pointer"
        :class="{'text-danger' : task.status === 'to-visit',
        'text-warning' : task.status === 'at-the-moment',
        'text-success' : task.status === 'visited'}">
        {{ firstCharUpper (task.status)}}
        </span>
      </td>
      <td>
        <button @click="editTask(index,task)" class="btn btn-warning rounded-0">Edit</button>
      </td>
      <td>
        <button @click="removeTask(index)" class="btn btn-warning rounded-0">Remove</button>

      </td>
    </tr>
  </tbody>
  </table>
  </div> 
  </div>
</template>

This is my json payloads for each request I am trying to send. These are the various scenarios I want to test but I want to test each in a single request by putting them in an array and pass it as the body in the post request
Please let me know if I need to provide more details. Thanks

{
    "validTransaction": [
        {
            "password": "VhIDsPpHsqNGtARyQgKsOx5I794bunij",
            "amount": "10",
            "transaction_type": "01",
            "cc_expiry": "1224",
            "cardholder_name": "Simon Jones",
            "gateway_id": "KE5905-88",
            "cc_number": "5187013017662435",
            "cvv": "123"
        }],

    "invalid_transactionType": [
        {
            "amount": "10",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1221",
            "cc_number": "4761739001010119",
            "gateway_id": "KE5905-88",
            "password": "VhIDsPpHsqNGtARyQgKsOx5I794bunij",
            "transaction_type": "08",
            "cvv": "201"
        }],

    "missing_transactionType": [
        {
            "amount": "10",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1221",
            "cc_number": "4761739001010119",
            "gateway_id": "KE5905-88",
            "password": "VhIDsPpHsqNGtARyQgKsOx5I794bunij",
            "transaction_type": "",
            "cvv": "201"
        }],

    "invalid_CardNumber": [
        {
            "amount": "10",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1224",
            "cc_number": "47617390010119",
            "gateway_id": "KE5905-88",
            "password": "VhIDsPpHsqNGtARyQgKsOx5I794bunij",
            "transaction_type": "01",
            "cvv": "201"
        }],
    
    "invalid_expDate": [
        {
            "amount": "10",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1521",
            "cc_number": "4761739001010119",
            "gateway_id": "KE5905-88",
            "password": "VhIDsPpHsqNGtARyQgKsOx5I794bunij",
            "transaction_type": "01",
            "cvv": "201"
        }],

    "invalid_gatewayId": [
        {
            "amount": "10",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1224",
            "cc_number": "4761739001010119",
            "gateway_id": "KE590511-88",
            "password": "VhIDsPpHsqNGtARyQgKsOx5I794bunij",
            "transaction_type": "01",
            "cvv": "201"
        }],

    "invalid_password": [
        {
            "amount": "10",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1224",
            "cc_number": "4761739001010119",
            "gateway_id": "KE590511-88",
            "password": "12gKsOx5I794bunij",
            "transaction_type": "01",
            "cvv": "201"
        }],

    "invalid_amount": [
        {
            "amount": "",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1224",
            "cc_number": "4761739001010119",
            "gateway_id": "KE590511-88",
            "password": "12gKsOx5I794bunij",
            "transaction_type": "01",
            "cvv": "201"
        }],
    
    "invalid_cvv": [
        {
            "amount": "10",
            "cardholder_name": "Simon Jones",
            "cc_expiry": "1224",
            "cc_number": "4761739001010119",
            "gateway_id": "KE590511-88",
            "password": "12gKsOx5I794bunij",
            "transaction_type": "01",
            "cvv": "20"
        }]
    }

And below is the test

let request;
describe('Given the Users api', () => {
    before(function () {
        cy.fixture("transactionRequest").then(data => {
            this.data = data;
            request = [
                this.data.invalid_transactionType,
                this.data.missing_transactionType,
                this.data.invalid_CardNumber,
                this.data.invalid_expDate,
                this.data.invalid_gatewayId,
                this.data.invalid_password,
                this.data.invalid_amount,
                this.data.invalid_cvv,
            ]
        })
    })
    context('When I send POST /transaction', () => {
      it('Then it should send a transaction', () => {
        cy.request({
          method: 'POST',
          url: "/transaction",
          body: request
        })
          .should((response) => {
            expect(response.status, 'successful POST').eq(200)
          });
      });
    });
  });

I am looking to get an alert when click on submit button, but getting error when page loads: Uncaught ReferenceError: JQuery is not defined
I’m beginner at front-end development, trying to learn javascript and JQuery, can anyone help to fix? Also what went wrong?

html code:

<section>
  <div>
    <div class="row text-center">
      <div class="col-sm-12 text-center">
        <div class="row">
          <div class="col-sm-8 col-sm-offset-2">
            <div>
              <h2>CONTACT US</h2>
            </div>
            <form id="contactForm">
              <input type="hidden" data-form-email="true">
              <div class="form-group">
                <input type="text" class="form-control" name="name" required="" placeholder="Name*" data-form-field="Name">
              </div>
              <div class="form-group">
                <input type="email" class="form-control" name="email" required="" placeholder="Email*" data-form-field="Email">
              </div>
              <div>
                <input type="submit" id="submit" name="submit" class="btn btn-lg btn-danger">
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

Script:

<script>
    JQuery('#contactForm').submit(function(){
    event.preventDefault();
    alert('Working');
    });
</script>

When I checked page source:

<script src='https://yourdevweb.com/testing/wp-includes/js/jquery/jquery.min.js?ver=3.6.0' id='jquery-core-js'></script>
<script src='https://yourdevweb.com/testing/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2' id='jquery-migrate-js'></script>

Hi,

Please see the attached picture for the settings of the extension Ponicode – used to automate unit tests

How do I find the Node Path for node js on my windows machine?

Node path for the test runner and tasks is required, and if absent node is looked up in PATH

However the default is not happening and I think I need to enter the Node path in the box myself

I have node V16.13 (LTS Support)
Node is working – I confirmed with using node to start a server on localhost as a test
I am not sure what “set the nodePath in your settings” means
I’ve uninstalled and re-installed Ponicode and rebooted my computer
I’ve contacted the Ponicode Team about this error too

Thanks,

there is an active site available. I have added a cookie to this site. When the site opens, a button like accept appears and I can accept and close it. My question is how can I set the duration of this? Where are these cookie files? I see Js Document.cookie videos. They write to Script.js files. Where do they copy this file? I would be very happy if you answer.

The site is currently active.

I copied the ready-made script code from the site called Mosono and copied it to my default.aspx page. So what should I do next? How do I set the duration of this cookie? Where is this data stored? I couldn’t find it in AppData Local folder for Chrome. Or rather, is it a cookie? I am providing the link for you to view the site. I would be glad if you help.

http://www.kamerholding.com.tr

I have issue customizing my popup windows with mapboxgl.
No matter what i do in custom info_windows.scss it’s always display to default settings that are Inherited from mapbox-gl.css
I tried added a class to the popup element using the following code:
new mapboxgl.Popup({ className: ‘popups’ }) .setLngLat(coordinates) .setHTML(description) .addTo(map);
but still doesn’t pick up customize css code apply on .popups class eventhough my class popups applied on the element.
Any clue how to make this work?

_info_windows.scss

.popup {
  border-radius: 15px;
  border-color: orange;
  border-style: solid;
  overflow-y: auto;
  flex: 0 1 auto;
  display: flex;
  flex-direction: column;
  margin-bottom: 60px;
  padding-bottom: 25px;
  border: 2px solid #0b5cb2;
  box-shadow: 1px 1px 3px 0px rgb(0 0 0 / 55%);
  width: 100%;
}


init_mapbox.js

const addMarkersToMap = (map, markers) => {
  markers.forEach((marker) => {
    const popup = new mapboxgl.Popup({ className: 'popup' }).setHTML(marker.info_window); // add this

    new mapboxgl.Marker()
      .setLngLat([marker.lng, marker.lat])
      .setPopup(popup)
      .addTo(map);
  });
};


application.html.erb

    <script src='https://api.mapbox.com/mapbox-gl-js/v2.6.0/mapbox-gl.js'></script>
    <link href='https://api.mapbox.com/mapbox-gl-js/v2.6.0/mapbox-gl.css' rel='stylesheet' />


[enter image description here][1]


  [1]: https://i.stack.imgur.com/YY6kS.png

Trading view widget is working fine except one parameter allow_symbol_change: false,. I tried this and its not working at all.

Code: –

const widgetOptions: ChartingLibraryWidgetOptions = {
  symbol: this.props.symbol as string,
  allow_symbol_change: false,
  datafeed: Datafeed,
  interval: this.props.interval as ChartingLibraryWidgetOptions['interval'],
  container: this.props.container as ChartingLibraryWidgetOptions['container'],
  library_path: this.props.libraryPath as string,
  locale: getLanguageFromURL() || 'en',
  disabled_features: ['use_localstorage_for_settings'],
  enabled_features: ['study_templates'],
  charts_storage_url: this.props.chartsStorageUrl,
  charts_storage_api_version: this.props.chartsStorageApiVersion,
  client_id: this.props.clientId,
  user_id: this.props.userId,
  fullscreen: this.props.fullscreen,
  autosize: this.props.autosize,
  theme: 'Dark',
  studies_overrides: this.props.studiesOverrides,
  timeframe: '1w',
}

Is ther any other method for this also like disable_feature

Is there any difference between attaching callbacks or event listeners for child process in nodejs. like –

const execute = require('child-process').exec;
const process = execute('ping -n 1 www.google.com'); // or ping -c 1 www.google.com for mac

process.stdout.on('data', data => {
    console.log(data)
})  

In the above code i am using event listener for the output and i am getting stdout data in windows but can’t get the output in macos. But if i use callback like –

const execute = require('child-process').exec;

execute('ping -c 1 www.google.com', (error, stdout, stderr) => {
   console.log(stdout);
})

I am getting the output data in both windows and mac.. Is there any difference using callback or event listeners(both are asynchronous)?

I am using a site to create before and after slider widgets, I than want to use the widget for my website. The code is:

<script src="https://apps.elfsight.com/p/platform.js" defer></script>
<div class="elfsight-app-738dcbf9-2e16-40e0-8b87-d21a5fa6a201"></div>

This results in the two widgets being in a vertical line, how do
I make it so the widgets are next to each other in horizontal line?

I want to convert all the geojsons in a file to shapefiles in a single batch using ogr2ogr library in NodeJS. I know it can be done directly from the terminal using the gdal cli, but I want do know how to do it in Node. Thanks alot!

**I have this code to convert a single file:

// Using CommonJS modules
const ogr2ogr = require('ogr2ogr').default;
const fs = require('fs') ;

// Promise API
(async() => {

   

  // Convert path to GeoJSON.
  let {data} = await ogr2ogr('/Users/MihaiB/Desktop/test_josm/test22.geojson' );
  console.log(data);

  
 
  let {stream} = await ogr2ogr( data, {format: 'ESRI Shapefile'}, {destination:'/Users/MihaiB/Desktop/shapefile2.shx'});
    console.log(stream)

   
        
  
})()