jquery to remove link from class

nsns
edited February 25, 2019 in Questions
Need your help :)

I'm trying to remove the <a href linking on a div / class on a page that is a page includes. I'm having no luck with this syntax, am I way off? 

(function(skuid){
var $ = skuid.$; $(document.body).one('pageload',function(){ var myModel = skuid.model.getModel('MyModelId'); var myComponent = skuid.component.getById('MyComponentUniqueId'); $(".nx-field, nx-layout-above, a").each(function(){ if($(this).hasClass("nx-fieldtext")){ $(this).removeAttr("href"); }); })(skuid);

Comments

  • edited February 25, 2019
    Are you trying to make it so a user can't click on a Name field to navigate to that detail page?
  • nsns
    edited February 25, 2019
    yes that is correct :)
  • edited January 27, 2017
    OK - instead of doing a snippet, use a Template field (instead of model field) in your field editor.  Use triple braces instead of double and it will bring in the text of the name, and not an active hyperlink.  {{{Name}}} ... like that.  You have to have the Name field selected in your model, and the template needs to be related to the model for it to work.

    image


  • nsns
    edited January 27, 2017
    amazing, that's it! Thank you!
  • nsns
    edited November 9, 2017
    After testing this out today, it would become a chore to tag a lot of fields and not to mention, the field isn't editable after this is applied. I think the jQuery route would be better for numerous fields requiring this. 

    So, back to square one on this syntax :(
    (function(skuid){
     var $ = skuid.$;   $(document.body).one('pageload',function(){    var myModel = skuid.model.getModel('MyModelId');    var myComponent = skuid.component.getById('MyComponentUniqueId');            $(".nx-field, nx-layout-above, a").each(function(){              if($(this).hasClass("nx-fieldtext")){                  $(this).removeAttr("href");   });  })(skuid);
  • Gregory SmithGregory Smith ✭✭
    edited November 9, 2017
    How about something like:

    skuid.$('.nx-fieldtext a').click(function(e){e.preventDefault()});
  • Gregory SmithGregory Smith ✭✭
    edited January 28, 2017
    Of course, you might also want to edit the css to avoid confusion:

    .nx-fieldtext a, .nx-fieldtext a:hover{    color:inherit !important;
        text-decoration:none !important;
        cursor: text !important;
    }

    I would consider using a class for both the css and the js, so as to not affect every .nx-fieldtext a on the page, unless that is the intent.

  • Gregory SmithGregory Smith ✭✭
    edited January 29, 2017
    I would consider using a class for both the css and the js, so as to not affect every .nx-fieldtext a on the page, unless that is the intent.  You can add a classname, for instance, nolink to a field editor, a table, a wrapper etc. and any .nx-fieldtext a contained within will be affected: 
       skuid.$('.nolink .nx-fieldtext a').click(function(e){e.preventDefault()});
    and
       .nolink .nx-fieldtext a, .nolink .nx-fieldtext a:hover{    color:inherit !important;
            text-decoration:none !important;
            cursor: text !important;
        }
  • nsns
    edited January 29, 2017
    Thanks Greg! Between these two suggestions (@Chandra_V), I also used the theme builder to edit the link colors to match that of the body text to reduce program dependability within the syntax. 
     
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!