How can I add text to the Modify record icon

Got something cool to share with AppGini users? Feel free to post it here!
Post Reply
nycwebmaster
Veteran Member
Posts: 46
Joined: 2015-11-23 01:02

How can I add text to the Modify record icon

Post by nycwebmaster » 2019-03-14 14:23

Hi,

I'm including a picture so you guys can understand what I need to do. Basically I want to add the text "Click To Modify" to the glyph-icon on the children table to say: "Click Here To Modify"

Image

pböttcher
AppGini Super Hero
AppGini Super Hero
Posts: 525
Joined: 2018-04-01 10:12

Re: How can I add text to the Modify record icon

Post by pböttcher » 2019-03-14 18:36

Hi,

how did you add this glyph-icon?

User avatar
ronwill
Veteran Member
Posts: 101
Joined: 2015-08-08 10:12
Location: Cheltenham UK +Weatherford USA

Re: How can I add text to the Modify record icon

Post by ronwill » 2019-03-18 00:17

I don't know how to make the change by code but you can modify the 'children-TableName.php' file under templates directory relating to the children table tab.

Should be around line 137, here is image of change made to my file:
Sketch1.png
Sketch1.png (214.1 KiB) Viewed 908 times
Result is:
Sketch.png
Sketch.png (57.28 KiB) Viewed 908 times
Naturally this file gets overwritten by AppGini so either make read only or make copy and update when needed etc.

Cheers,
Ron
Ron - AppGini Pro V 5.76 Rev 1058
Gloucestershire, UK

nycwebmaster
Veteran Member
Posts: 46
Joined: 2015-11-23 01:02

Re: How can I add text to the Modify record icon

Post by nycwebmaster » 2019-03-27 15:20

Work perfect! Thanks!

User avatar
landinialejandro
Posts: 21
Joined: 2016-03-06 00:59

Re: How can I add text to the Modify record icon

Post by landinialejandro » 2019-05-20 16:10

hi! you can change dinamically whit the next code in dv.js

Code: Select all

$j('.view-on-click i').append(' click me!');
after loaded page.

onoehring
Veteran Member
Posts: 248
Joined: 2019-05-21 22:42
Contact:

Re: How can I add text to the Modify record icon

Post by onoehring » 2019-08-02 10:37

Hi landinialejandro,

your solution does not seem to work. I believe the reason is, that the specific part of the page has not been created in the browser, when the JS command is executed.

Olaf

onoehring
Veteran Member
Posts: 248
Joined: 2019-05-21 22:42
Contact:

Re: How can I add text to the Modify record icon

Post by onoehring » 2019-08-02 11:17

Hi,

maybe something like this can be used to make use of a timer which checks continuously (but we need to make sure, the click me is added only once).

Code: Select all

<script>
\$j(function() {
        setInterval(function() {		
		var n = \$j('   search if click me was added already    ').find('     something we need to search      ').length;
		
		if (n < 1 ) {
		\$j('.view-on-click i').append(' click me!');
		} 
		else {
		
		}		
	}, 1000);
})
</script>
Olaf

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 218
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: How can I add text to the Modify record icon

Post by jsetzer » 2019-08-02 12:55

Hey,

what about a PURE CSS ONE-LINER: Paste the following CSS-code into your CSS-file (or into your <style>-section for example in hooks/header-extras.php).

Code: Select all

.children-tabs td.view-on-click a::after { content: "Click here"; }
This is the result:

chrome_2019-08-02_14-42-10.png
chrome_2019-08-02_14-42-10.png (61.25 KiB) Viewed 156 times


Wanna play around a bit more with pure (Vanilla) CSS?

chrome_2019-08-02_14-47-32.png
chrome_2019-08-02_14-47-32.png (56.9 KiB) Viewed 156 times

Only little more in CSS:

Code: Select all

    .children-tabs td.view-on-click a::after { content: "Open"; }
    .children-tabs td.view-on-click .glyphicon { display: none; }
    .children-tabs td.view-on-click a {
        background-color: #fafafa;
        border: 1px solid silver;
        padding: 4px;
        color: black;
    }
Feel free to change the text, colors, borders etc.

Best,
Jan

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 218
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: How can I add text to the Modify record icon

Post by jsetzer » 2019-08-02 13:15

That code above was css-only. There is so much more when using JQuery, for example:

Replacing icon and adding btn-primary style (Bootstrap):
chrome_2019-08-02_15-11-15.png
chrome_2019-08-02_15-11-15.png (38.45 KiB) Viewed 154 times

Additional buttons per row with custom link:

chrome_2019-08-02_15-12-18.png
chrome_2019-08-02_15-12-18.png (48.25 KiB) Viewed 154 times

Regards,
Jan

onoehring
Veteran Member
Posts: 248
Joined: 2019-05-21 22:42
Contact:

Re: How can I add text to the Modify record icon

Post by onoehring » 2019-08-03 06:42

Hi Jan,

thank you a lot for your solution and ideas. Really good.

Olaf

Post Reply