Sign in Register
Go to solution
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • nauman 9 posts 101 karma points
    Oct 26, 2018 @ 07:22
    nauman
    1

    when page refresh user selected value disappear from custom editor view

    Hi all!

    I have made a custom property editor which shows the user a drop down list but when the user select a value and refresh the page the user selected option changed, any help?

    I have provided the screen shots of the issue and code

    enter image description here enter image description here enter image description here enter image description here

    Copy Link
  • Michaël Vanbrabandt 863 posts 3348 karma points c-trib
    Oct 26, 2018 @ 07:29
    Michaël Vanbrabandt
    1

    Hi nauman,

    if you don't hit the save button on the bottom right, the value will indeed by empty again after a refresh because no action is executed to save the value.

    Hope this helps!

    /Michaël

    Copy Link
  • nauman 9 posts 101 karma points
    Oct 26, 2018 @ 08:00
    nauman
    0

    hi Michael!

    Thank you for your quick response and i have already did that [save and publish] but still it showing empty.

    Thanks Nauman

    Copy Link
  • Michaël Vanbrabandt 863 posts 3348 karma points c-trib
    Oct 26, 2018 @ 08:05
    Michaël Vanbrabandt
    1

    Hi nauman,

    can you show us the rendered html of the select? Are the values filled in for your select options?

    Can you post the content of your js controller?

    Hope this helps!

    /Michaël

    Copy Link
  • nauman 9 posts 101 karma points
    Oct 26, 2018 @ 09:55
    nauman
    0

    Hi Michael,

    I have attached the screen shots html and controller kindly have a look and assist me if am doing something wrong.

    Thanks Nauman

    Html: enter image description here Controller: enter image description here

    Copy Link
  • Michaël Vanbrabandt 863 posts 3348 karma points c-trib
    Oct 26, 2018 @ 10:09
    Michaël Vanbrabandt
    1

    Hi nauman,

    I see the problem, you use Jquery to create your select options which doens't have the ng-value property which is used by Angular.

    Normally you do something like this in order to create your select:

    <select name="sel" ng-model="model.value">
  <option ng-repeat="option in model.availableOptions" ng-value="option.value">{{option.name}}</option>
</select>

    Where model.availableOptions is your array of items to add to your select.

    So in your angular controller, in your ajax call set the $scope.model.availableOptions property with your results and then using the html I provided above render the options of your select.

    More info:

    https://docs.angularjs.org/api/ng/directive/select

    Hope this helps!

    /Michaël

    Copy Link
  • nauman 9 posts 101 karma points
    Oct 26, 2018 @ 10:41
    nauman
    0

    Hi Michael,

    I have stetted $scope.model.availableOptions=data on the success of my ajax call and rendered the Html that you have provided but then it doesn't show the text just empty drop down and if i alert the $scope.model.availableOptions it has all the values.

    Thanks Nauman enter image description here

    Copy Link
  • Michaël Vanbrabandt 863 posts 3348 karma points c-trib
    Oct 26, 2018 @ 10:55
    Michaël Vanbrabandt
    1

    Does it have the properties value and name? Can you show us the results of this availableOptions ?

    /Michaël

    Copy Link
  • nauman 9 posts 101 karma points
    Oct 26, 2018 @ 11:25
    nauman
    0

    Hi Michael,

    this is the code and output

    Thanks Nauman

    Controller enter image description here

    Alert

    enter image description here

    Html

    enter image description here

    Copy Link
  • Michaël Vanbrabandt 863 posts 3348 karma points c-trib
    Oct 26, 2018 @ 11:31
    Michaël Vanbrabandt
    1

    Nauman,

    like I thoughed, you don't have the properties value and name so use this:

    <select name="sel" ng-model="model.value">
  <option ng-repeat="option in model.availableOptions" ng-value="option">{{option}}</option>
</select>

    Hope this helps!

    /Michaël

    Copy Link
  • nauman 9 posts 101 karma points
    Oct 26, 2018 @ 12:11
    nauman
    101

    Hi Michael,

    Its working fine now you were great help thank you for your time and effort.

    Thanks Nauman

    Copy Link
  • Michaël Vanbrabandt 863 posts 3348 karma points c-trib
    Oct 26, 2018 @ 12:16
    Michaël Vanbrabandt
    1

    Hi nauman,

    glad it solved your problem!

    Don't forget to mark the solution for this thread!

    Have a nice day and weekend!

    /Michaël

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft