Javascript: Insert name of current file into a field?

Question

I have several identical HTML files that all have different names:

3089.html
68985.html
101.html
...and more

Each file has an input field with an id of "productsku":

<input type='text' id='productsku' />

I would like this field to be filled with the name of the HTML file. I only want to use Javascript to do this (I don't want to use jQuery, as I don't want to load the jQuery library for such a small task).

Here is my Javascript code:

    <script>
        window.onload = function(){
    document.getElementById('productsku').value=location.pathname; 
}
    </script>

It works, but it puts the file name extension and path rather than just the name. e.g. it puts /path/3089.html rather than just "3089"

Is there any way I can correct this?

Here is a JS fiddle.

Does this answer your question? [How to get the file name from a full path using JavaScript?](https://stackoverflow.com/questions/423376/how-to-get-the-file-name-from-a-full-path-using-javascript) — mrdeadsven, Nov 12 '19 at 13:14

score 4 · Answer 1 · answered Nov 12 '19 at 13:13

How about:

const parts = location.pathname.split('/'); // split the pathname into parts
const [filename] = parts[parts.length - 1].split('.'); // take the filename from the last part of the path

document.getElementById('productsku').value = filename;

<input type="text" id="productsku" />

bhuvnesh pattnaik · Answer 2 · 2019-11-12T13:27:09.730

1

here is the possible Solution

let path = 'domainNameOrIPAddress/path/3089.html';
// let path = location.pathname; // Use this to get actual result
let val = path.split('/').pop().replace('.html', '');
document.getElementById('productsku').value=val;

<input type='text' id='productsku' />

edited Nov 12 '19 at 13:27

answered Nov 12 '19 at 13:14

bhuvnesh pattnaik

1,365
7
14

1

Here is **a** solution – freefaller Nov 12 '19 at 13:15
1

Not sure why you rolled-back the edit... it is **not THE** solution... it is one of many possible solutions – freefaller Nov 12 '19 at 13:17
I did not said `Here is the only solution`, just said `Here is the solution` which indirectly meant the same that it is one of many possible solutions. – bhuvnesh pattnaik Nov 12 '19 at 13:24
1

Sorry, but they mean exactly the same thing, and will be understood to mean exactly the same thing... I repeat, it is not the solution, and you should either edit it to say "a solution" or stop editing your answer when people correct it – freefaller Nov 12 '19 at 13:26
1

@bhuvneshpattnaik check out this thread: https://ell.stackexchange.com/questions/90117/what-is-the-difference-between-a-and-the. I hope you'll understand better what is the actual difference between *a* and *the* – Sebastian Kaczmarek Nov 12 '19 at 13:28
Are we here to discuss the difference b/w a and the ? – bhuvnesh pattnaik Nov 12 '19 at 13:29
Of course not, unless you roll-back edits to your post that are meant to improve its readability for other folks ;) Among others, the edits' purpose is to improve readability, grammar, typos, etc. so if someone breaks this rule, it's ok to tell him not to do it ;) But you're right, we can close this discussion already. – Sebastian Kaczmarek Nov 12 '19 at 13:33

score 0 · Answer 3 · answered Nov 12 '19 at 13:14

0

You could use RegEx to extract it...

var path = "/this/that/other/12345.html";
console.log(path.match(/\/(\d+)\.html$/i)[1]);

answered Nov 12 '19 at 13:14

freefaller

19,368
7
57
87

score 0 · Answer 4 · answered Nov 12 '19 at 13:18

0

Hope this helps you:

const productsku = /\/([^/]+)\.html/.exec(location.pathname)[1]
document.getElementById('productsku').value=productsku;

answered Nov 12 '19 at 13:18

Long Nguyen Duc

1,317
1
8
13

score 0 · Answer 5 · answered Nov 12 '19 at 13:21

The better way is to extract the name from the path, like this :

<script>
    window.onload = function(){
        var locationName = location.pathname.substring(location.pathname.lastIndexOf('/')+1, location.pathname.lastIndexOf('.html'));
        document.getElementById('productsku').value=locationName; 
    }
</script>

Javascript: Insert name of current file into a field?

5 Answers5