How to make listview slide bounce back without removing the item


#1

The sample code is as follows:

$('#list').mobiscroll().listview({
        stages: [{
            percent: -20,
            color: 'red',
            icon: 'remove',
            action: function (event, inst) {
                **inst.remove(event.target);**
                return false;
            }
        }]
    });

I want the user to be able to slide the item which triggers an action, but I don’t want the row to be removed after the fact, so I deleted the following line:

inst.remove(event.target)

Obviously this prevents the row from being removed, which is good. However, it no longer bounces back the way sliding from the other side does. It just gets stuck in the middle. How can I fix it so that it bounces back?


#2

Hi Vincent,

Just remove the retun false; row too and the item will slide back.


#3

Thanks Gabi but that didn’t work. Here’s my exact code.

$('#timeofflist').mobiscroll().listview({
    iconSlide: true,
    theme: 'ios',
    stages: {

      right: [{
          key: 'stage2',
          color: '#efb611',
          text: 'Cancel',
          icon: 'cancel-circle',
          action: function (event, inst) {
              updateTimeOffStatus(event.target.id,'C');
          }
      }]
    }
});

Any other ideas?


#4

Thanks for getting back, Vincent!
Are you getting any console errors?


#5

Well, I don’t know why but the problem is not happening anymore. I did add some more logic to this page yesterday, so I guess whatever I added made it work. Like it was incomplete before. Come to think of it, probably the function I was calling (updateTimeOffStatus) didn’t exist yet. That’s probably what it was.