How can I verify the presence of links in an input field and determine its character count?

I've dived into coding for this project and I'm making progress. Here are my objectives: 1) Verify the length of URLs entered in a field and reduce each link's length by 20 if it exceeds 20 characters. 2) Calculate the remaining characters in an input field

The JavaScript code in profile.js (prototype):

function checkurl_total_length(text) {
    var text = "";
    var matches = [];
    var total_length = 0;
    var urlRegex =  /(http|https):\/\/[A-Za-z0-9\.-]{3,}\.[A-Za-z]{3}/;

    text.scan(urlRegex, function(match){ matches.push(match[0])});
    for (var index = 0; index < matches.length; ++index) {
        item = matches[index];
        reduce_length = matches.length*20;
        if(item.length>20) {
            total_length = total_length + item.length - reduce_length;
        }
        else {
            total_length = total_length + item.length;
        }


    }

    return total_length;
}

function count_characters(field){
   var limitNum=140;
    var link_length = 0;
   if(checkurl_total_length(field.value)!=0) {
      link_length =link_length+ checkurl_total_length(field.value);
    }
    else {
      link_length = 0;
   }
     limitNum = limitNum+link_length;

    if( link_length !=0 ){
     $("links").update("with links");

    }
    left = limitNum-field.value.length;

    $("count").update(left);

}

THE HTML:

<!DOCTYPE HTML>
<html lang="en"><head>


<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>JUST A TEST FILE</title>
<script src="prototype.js" type="text/javascript"></script>
<script src="profile.js" type="text/javascript"></script>

</head><body>
<h1>
CHARACTERS COUNT
</h1>
<div class="container_24">
    <h2 id="title2">
        TESTING
    </h2>
    <div class="grid_24">

        <div id="count"></div>
         <br /s>

        <div id="links"></div>
   <form >

    <textarea wrap="hard" onpaste="count_characters(this);" onkeyup="count_characters(this);" onkeydown="count_characters(this);"  id="updates" onfocus="count_characters(this);" name="test"/> </textarea>
    <input type="submit" value=" " name="commit" disabled=""/>
    </form>
    </div>

</div>
<!-- end .container_24 -->
</body></html>

The character count functionality is working correctly, but the URL length validation is not. Any tips on why this might be happening?

Answer №1

uncertain, however, is this the correct approach?

verifyTotalLengthOfStringInput(field.value!=0)   // ) != 0

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

the client requires valid intentions to be specified

I'm currently troubleshooting a discord bot designed to stream audio URL to a voice chat. However, I encountered an error message: TypeError [ClientMissingIntents]: Valid intents must be provided for the Client. at Client._validateOptions (/home/runn ...

Is the input in the array? How to find out?

I am currently facing an issue with a script that I have created to count array elements matching a user input. Strangely, all if statements in the script seem to be returning false. I have verified that both the array element and the input value are stri ...

I seem to be having trouble with jQuery. Every time I try to submit my form, nothing happens

I am currently working on creating a web page for a numerical game, but I am facing difficulties with my jQuery implementation. Despite checking all my placements, nothing seems to happen when I click on the Submit button. Any assistance would be greatly a ...

Implementing jquery-confirm in CodeIgniter: A Step-by-Step Guide

I'm having some trouble with the jquery-confirm plugin from . Everything seems to be working fine, but when I try to delete an item, the jquery pops up an alert. However, when I click "okay", it doesn't actually delete the item. I can't figu ...

Unable to adjust image opacity using jQuery

I am attempting to change the opacity of an image based on a boolean flag. The image should have reduced opacity when the var pauseDisabled = true, and return to full opacity when pauseDisabled = false. To demonstrate this, I have created a fiddle below. ...

Streamlining async/await in for loops using Promise.all: A guide

I'm trying to understand how Promise.all() works in this code. I've learned that you can execute async operations concurrently with Promise.all() for better performance. Currently, the code uses nested for-loops (which is not ideal): type ListGro ...

Encountering a "window not defined" error while implementing Leaflet in my Nuxt JS application

I'm encountering an issue while trying to generate my nuxt app, specifically on my 'Area' page. It seems like the error is related to the leaflet maps being used on this page. https://i.sstatic.net/Cj9ai.png Initially, I attempted to resol ...

Tips for presenting random images from an assortment of pictures on a webpage

I'm looking to enhance my website by adding a unique feature - a dynamic banner that showcases various images from a specific picture pool. However, I'm unsure of how to find the right resources or documentation for this. Can you provide any guid ...

Tips for transforming a JSON array into a JavaScript 2D array

I am struggling to figure out how to convert the given JSON data into a JS 2D array directly from HTML. [{"fields": {"diameter": 23.0, "neighbourhood": "WEST END"}, "model": "hug.tree", "pk": 345}, {"fields": {"diameter": 14.0, "neighbourhood": "MOUNT P ...

Error: Module Not Found in Node.js

Hello everyone, I'm a newcomer to the world of JS and Node.js and I'm facing some issues while trying to set up a webdriverio project using cucumber and PageObject. Whenever I attempt to run a test, I encounter this error message: ERROR: Cannot ...

When attempting to import my JSX file into page.js, I continue to encounter the error "module not found." How can I troubleshoot and resolve this issue in Visual Studio Code

I recently created a new file called mysec.jsx in the components folder of src. I then used the export function to properly export it. However, when I tried to import this file in page.js using the import function, I encountered an error message that said: ...

Unable to include Authenticated Routes in react router dom

Currently, I am utilizing react-router-dom to manage routing for users who are authenticated and non-authenticated. However, I have encountered an error in Element due to missing properties. Is there a way to make withoutAuth() function properly for authe ...

Automatically omitting a selector that mimics a switch

After conducting thorough research, I discovered a variety of solutions using jQuery and Vanilla. While one answer perfectly addressed my issue, it failed to integrate effectively with the rest of my code. So, I decided to modify the code from this Stack O ...

A step-by-step guide to moving Vue .prototype to its own file

I have a couple of functions that I need to add to Vue's .prototype. However, I don't want to clutter up the main.js file. I attempted to move the prototypes like this: //main.js import "./vue-extensions/prototypes"; ...

Is it possible to activate a function in an express application when it is terminated?

I am looking for a way to handle server termination events by dumping data to disk. I'm wondering if there is a better way than logging everything in a database every few seconds using setTimeout. One possibility could be: app.on("event:terminate", ...

Is there a way to retrieve the client's IP address from the server side within a Next.js application?

How can I determine the user's time zone and location in order to generate a server-side page tailored to their specific location and time zone? I am struggling to retrieve the user's IP address from the request or the localhost IP address (127.0 ...

What is the reason for needing a page reload in Javascript or JQuery?

I'm curious why Javascript or jQuery require a page reload before applying certain effects. CSS updates in real-time, as demonstrated by the following example: This changes dynamically without needing to refresh the page @media all and (max-width:7 ...

The frisbyjs test is not passing due to the absence of proper HTTP headers being sent by the get()

My frisbyjs test is failing because the x-access-token and x-key HTTP headers are not being sent. Am I missing something? This seems like a simple mistake. Here is the outer test that contains the failing test within afterJSON(): frisby.create('Logi ...

Unable to display a Google map within a webview when viewing a local HTML file

I am currently working with a local HTML file called basicmap.html that includes the following code: <!DOCTYPE html> <html> <head> </head> <body> <div id="map"></div> <script> ...

Retrieve LatLng coordinates for a Heatmap on Google Maps using data stored in a MySQL database

I am currently working on a GIS project where I aim to develop a hotspot crime mapping feature using Google Heatmap from the Google Maps API. I have a large dataset of crime locations (including latitude and longitude) stored in a MySQL database. While exp ...