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: 611
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 1147 times
Result is:
Sketch.png
Sketch.png (57.28 KiB) Viewed 1147 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
AppGini Super Hero
AppGini Super Hero
Posts: 298
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
AppGini Super Hero
AppGini Super Hero
Posts: 298
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: 257
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 395 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 395 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: 257
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 393 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 393 times

Regards,
Jan

onoehring
AppGini Super Hero
AppGini Super Hero
Posts: 298
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