The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> remove extension from file name
Tiff 1998
post May 7 2017, 12:36 AM
Post #1





Group: Members
Posts: 5
Joined: 7-May 17
Member No.: 26,398



Hello,

I have a script that copies the anchor text when I click on a link and copies it to a text input. The problem I have is that I need to remove the file extension before it gets copied.
This is what I have:

CODE

$(function () {
    $('#rightbox a').on('click', function () {
        var text = $('#myfilename');
        text.val($(this).text());    
        $Form.click();
    });
});


Any help would be very appeciated, I am completly new to javascript. I have found some info about regex and last indexof, but have no idea how to use them.

Sorry btw the links are like this:
CODE
<a href="/family_photos/filename1.jpg">filename1.jpg</a>
<a href="/family_photos/filename2.jpg">filename2.jpeg</a>


This post has been edited by Tiff 1998: May 7 2017, 12:44 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post May 7 2017, 07:57 AM
Post #2


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



QUOTE(Tiff 1998 @ May 7 2017, 07:36 AM) *

Hello,

I have a script that copies the anchor text when I click on a link and copies it to a text input.

Hello!

Normally, clicking a link loads a new page, which cancels any script on the first page. Are there more things going on here? unsure.gif

QUOTE
The problem I have is that I need to remove the file extension before it gets copied.

This is what I have:

CODE

$(function () {
    $('#rightbox a').on('click', function () {
        var text = $('#myfilename');
        text.val($(this).text());    
        $Form.click();
    });
});


That's jQuery, which I don't know very well, but isn't "#myfilename" an ID? I think you'd have to get the clicked element's HREF value with this.href or this.getAttribute('href');.

Since the HREF value may contain the directory path (and not just the file name) you might split the HREF value by its slashes into an array with split('/');, where the file name is the last array segment.

Next, split the file name by its period sign(s) into an array, where the last segment will be the file extension. Discard that last segment with the pop() method.

If the file name doesn't contain any period signs, the array will now only contain a single segment, which is the file name. But if there are period signs (like in "dog.1.jpg") there will be two or more array segments, and you must join them together into a string again (with a period sign between each segment) using join('.');.

Regex could also be used, and is shorter but usually more tricky.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 7 2017, 08:28 AM
Post #3


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



But he already has the link text (or so he says). so, provided no file name contains more than one dot, it would be enough to split on the dot and pick the first bit (of two) out of the array.

CODE
var x = 'foo.jpg';
x = x.split('.');
x = x[0];
alert(x);


About indexOf(), it tells you the index position of a sub string. As an example, if the string is "abcdef", "c" has index 2. JS counts from zero. "a" has index 0. lastIndexOf() does what it sounds like, finds the index of the last occurrence of a substring. So lastIndexOf() would work even if the filename contains several periods.

When the index of the part you want to get rid of is known you could use the substring() method to catch the rest. It returns the substring between (and not including) two indexes.

CODE

var str = 'foo.bar.jpg';
var n = str.lastIndexOf('.'); //returns "4"
var name = str.substring(0,n); //returns "foo.bar"
alert(n);
alert(name);


How to get that into the jQuery stuff I don't know. sad.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post May 7 2017, 01:08 PM
Post #4


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ May 7 2017, 03:28 PM) *

But he already has the link text (or so he says).

I wasn't sure, since he wrote "anchor text". But if it really is link text you might simply use something like:

CODE
var link_txt=this.textContent;
link_txt=link_txt.replace('.jpg','');
link_txt=link_txt.replace('.jpeg','');
link_txt=link_txt.replace('.png','');

(add or remove replace operations, depending on how many different file extension types you use).
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Tiff 1998
post May 8 2017, 12:20 AM
Post #5





Group: Members
Posts: 5
Joined: 7-May 17
Member No.: 26,398



Hi guy's,

Thank you for the replies. Sorry I didn't get back to you sooner, one of my kids got sick so I've been looking after her.

I'll try out what you have provided my and see how I go. Thank you very much for your help.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Tiff 1998
post May 8 2017, 04:47 AM
Post #6





Group: Members
Posts: 5
Joined: 7-May 17
Member No.: 26,398



I got it working. I ended up using regex, what a brain twister that is.
So my code now is:
CODE
$(function () {
    $('#rightbox a').on('click', function () {
        var text = $('#myfilename');
        text.val($(this).text());
var fileName =$(this).text();
        fileName = fileName.replace(/\.[^/.]+$/, "");
        text.val(fileName);    
        $Form.click();
    });
});


Thank you for your help.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 04:04 AM