-1

I need to identify the row of the button click.Button is added dynamically throught a data repeater

I need to identify the row of the button click.Button is added dynamically throught a data repeater

@for (int i = 0; i < Model.lstUPC.Count; i++)
{
  <div class="col-md-1 addDelete">
    <input type="submit" value="+" class="form-control" name="UPCRowAdd" id="MPNet" />
  </div>
  <div class="col-md-1 addDelete">
    <input type="submit" value="-" class="form-control" name="UPCRowAdd" id="MPNet" />
  </div>      
}

Controller code

[HttpPost]
    public ActionResult ItemSetup(ItemSetupModel itemSetupModel,  string UPCRowAdd, string command)
    {
        string queryString = string.Empty;
        if (UPCRowAdd == "+")
        {                     
                UPC upc = new UPC();
                itemSetupModel.lstUPC.Add(upc);                   
         }
    }

Model code

namespace PricingUpdates.Models
 {
   public class UPC
   {
    public string ItemNumberForUPC { get; set; }
    public string GCOwner { get; set; }
    public string GCFeeItem { get; set; }
    public string GCBranded { get; set; }
    public string query { get; set; }

  }
  public class ItemSetupModel
  {
  public StoreSelectionModel storeSelectionForUPC { get; set; }
  public List<UPC> lstUPC { get; set; }  
  } 
}

I have the button being generated dynamically ie based on the lstUPCCount(a list).Now whenever a button is clicked i need to identify which position or the index of the button clicked.How can i identify that.

Aiswarya Rajendran
  • 1
  • 4
  • Show your `ValidateDetailsForSub()` function (you can just add `data-index="@i` attribute to your button but its unclear why you want the index of the item in the collection - it suggests you have basic design problem) –  Nov 28 '17 at 06:49
  • And as a side note, `id="MPNet` means you ave duplicate `id` attributes which is invalid html. –  Nov 28 '17 at 06:51
  • If i don't index is there any other way to identify the button which is clicked in the repeating elements. – Aiswarya Rajendran Nov 28 '17 at 07:30
  • That depends on what your code is doing (which is why I asked your to show it). You can of course do this in the normal fashion by giving your buttons a class name and then using `$('.yourClassName').click(function() { var theButton = $(this); ....});` but we do not know what you want to do with it. –  Nov 28 '17 at 07:34
  • I need to keep adding buttons row wise based on the items in the list.So each item in a list will have a button against it in UI. Each button add would help to add the new value in the list and delete button would remove item from the list.So accordingly the elements in the uI will also be removed.So i need to identify which row of the button is click to remove that row of elements alone – Aiswarya Rajendran Nov 28 '17 at 07:36
  • Don't tell me in comments. Edit your question to explain what your doing (and why) and show your code! –  Nov 28 '17 at 07:38
  • It also makes no sense why you are repeatedly adding `@Html.HiddenFor(m => m.SearchIndex)` inside your loop –  Nov 28 '17 at 07:39
  • I have edited the post to show controller code.I added hidden field to check if i can find the index by setting a value in hidden field. – Aiswarya Rajendran Nov 28 '17 at 07:41
  • I meant your `ValidateDetailsForSub()` script :) And your POST method makes no sense in relationship to your view code (you have not shown the relevant parts of the view that would bind to any of those parameters except for the `string UPCRowAdd` parameter) –  Nov 28 '17 at 07:46
  • ValidateDetailsForSub() dosent contain anything i am trying to find how i can get index in the javascript function based on which row button has been clicked. – Aiswarya Rajendran Nov 28 '17 at 07:54
  • Based on my previous comments - `` and `$('.add').click(function() { var index = $(this).data('index'); ..... });` But why you want the index of the item in the collection is not clear (and it certainly does not have any relationship to your POST method). –  Nov 28 '17 at 07:59
  • I just want to identify in a series of buttons in repeater which button was clicked in the UI.I thought i can do it through index.I am not aware of any other solution.If you have a better solution can you please help me. – Aiswarya Rajendran Nov 28 '17 at 08:07
  • I don't know what you want to do with your code (you have not explained anything in your question about that), so impossible to help any further –  Nov 28 '17 at 08:09
  • I have added the ui.The UI contains buttons with '+' and '-'.Now this button keps increaing based on the list of items in the list.On the '+' button click i will increase the count of list.And '-' button to remove the elements in the list.So whenever button is clicked i need to know which row of the button is clicked. – Aiswarya Rajendran Nov 28 '17 at 08:17
  • That image suggests you want to dynamically add and remove collection items in the view, in which case refer [this answer](http://stackoverflow.com/questions/28019793/submit-same-partial-view-called-multiple-times-data-to-controller/28081308#28081308) and for a more complete example using `BeginCollectionItem` refer [this answer](http://stackoverflow.com/questions/40539321/partial-view-passing-a-collection-using-the-html-begincollectionitem-helper/40541892#40541892) –  Nov 28 '17 at 08:21
  • Now i am dynamicaly adding using my code.Only thing remaining is to identify which row of the button is clicked. – Aiswarya Rajendran Nov 28 '17 at 08:31
  • The code your have shown can never work correctly. Read the links I gave you to understand how to do it correctly –  Nov 28 '17 at 08:33
  • In the example i see that there is only one class CashRecipientVM and so in the cshtml you are able to pass IEnumerable. Also i see that for the entire collection only button is add button is there. In my case in place of CashRecipientVM i have multiple view models and in one view model i can have multiple buttons. – Aiswarya Rajendran Nov 29 '17 at 12:25

1 Answers1

1

You can use index to create the id of the controls and can get the id on click event.

ex. 

    @Html.Button(m => m.SearchIndex, new { id = i + "_Click", @class = "btnToBeChecked" })


    <script>
    $(".btnToBeChecked").on("click",function(){
        // Here index of the button would be assigned to new variable like below.
        var indexofButton = $(this).attr("id").split("_")[0];
    });
    </script>
Nais
  • 46
  • 7