I want to select a row from my igGrid and when submit button is clicked, I want that entire row to be passed down to the action method of the submit button. How can I do that ?
I have set features.Selection().Mode(SelectionMode.Row);
Is there a way to pass the entire row which was seleected to the action method or could i atleast get the id of the row selected.
Also is there a way other than using Jquery, Is there a .feature=> property through which we can pass the row or row id on button click. If not then please tell me how to do it through Jquery.
I need to know this urgently. Any help would be appreciated. also I have read the IgnitUi's website demo but still i cannot seem to achieve what i want .
If you could provide a short working sample , that would be great.
Thanks.
Hello zeppelin led,
Thank you for posting in our forums!
I see you have posted this question in another forum thread. Please see my response to this issue in your forum post here:
https://ko.infragistics.com/community/forums/f/ignite-ui-for-javascript/89745/post-selected-row-or-row-id-to-server-on-button-click
Yes your provided solution worked for me, thanks alot.
Can you please tell me how can i persist the selected item of igCombo on MVC's postback. When I select an option from the igCombo and click the submit button the combo loses the selected item on postback. I think this has something to do with model binding but i am not sure. Is there a property of igCombo to persist the the selected value on postback or is this an Asp.Net MVC query?
Hi zeppelin led,
We do prefer to have individual questions asked per forum thread. Doing this allows other forum users to quickly find an answer if they have similar questions.
For now, please see below for my responses to your questions.
1. I do not see this behavior. It may be possible that you do not have all the required styling for the control. Do you see this in the sample I provided earlier? Please see the following documentation for more information on including the required files:
https://www.igniteui.com/help/14.1/deployment-guide
2. Please let me know if setting dropDownOnFocus solves this.
3. In MVC, there's no real concept of a postback in the sense that WebForms has. You are on the right track that you would have to handle the igCombo's events and you would want to make $.ajax calls to your Controllers' actions in the handler. You could still use jQuery to hook to events or through using the wrapper's AddClientEvent method. Please see the following documentation for more information on this:
https://www.igniteui.com/help/14.1/using-events-in-netadvantage-for-jquery
https://www.igniteui.com/help/14.1/infragistics.web.mvc~infragistics.web.mvc.combowrapper~addclientevent
4. To achieve this, you would set the same ViewBag member during the initial GET request of the page. Try modifying my previous example's HomeController with the following:
[code] // // GET: /Home/ public ActionResult Index() { // This will select the items in the igCombo that have the following values. ViewBag.ProductComboSelectedItems = new int[] {1, 16}; return View(); } [/code]
5. You can set a null text for when the igCombo does not have any items selected. You can set this on the MVC Wrapper with the NullText() method. If you want to add an empty item to the selection list, you would need to add that to your datasource and handle it appropriately. For more information on the available methods on the igCombo's MVC Wrapper, please see the following documentation:
https://www.igniteui.com/help/14.1/infragistics.web.mvc~infragistics.web.mvc.combowrapper_members
Question 2: Solved
-----------------------------------------------------------------
Question3: I have added the addclientevent like this :
.AddClientEvent("selectionChanged","comboSelectionHandler") Is this syntax alright?
And i have added the follwoing BLOCKED SCRIPT
// function comboSelectionHandler(evt, ui) { console.log(evt); $.post("/Dashboard/Listing", { entityValue: document.getElementByName("EntityValue").val() //What do I write here? How to pass the selected item value to my POST method? }); } // ]]>
How to get the value of my combo box whose properties are the following:
.InputName("EntityValue").ID("listingCombo")
.ValueKey("EntityName").TextKey("EntityName")
.AddClientEvent("selectionChanged","comboSelectionHandler") // Please check the syntax.
This code is not working .. Please point out the mistakes. What am i doing wrong.
-----------------------------------------------------------------------------------
Question 4: I will test it , hopefully this will also be solved.
Question 5: Solved
After some research, the issue with the text disappearing is related to including bootstrap. From my initial tests it looks like the hover style somewhere within bootstrap may be setting the text color to white, which matches the background. I will need some more time to look into this.
You are using the correct syntax for the AddClientEvent() method. To pass the selected value to the controller action, you can either use the events arguments, or the combo's methods. You can find more information on this in our documentation here:
https://www.igniteui.com/help/api/2014.1/ui.igcombo#methods
https://www.igniteui.com/help/api/2014.1/ui.igcombo#events
The issues with using "document.getElementByName("EntityValue").val()" is that:
1. document.getElementByName() does not return a jQuery object. You would need to wrap this in a jQuery object to call .val().
2. The jQuery val() method, while it will work on getting the input's value, it does not access through our API. For this reason, we recommend using our API methods, which you can find more information from the links above.
Please see my modified sample I have attached to this post for a demonstration of these solutions.
I will have another update on my findings with the bootstrap text issue for you tomorrow.
Thanks I will try to implement AddClientEvent method later after i finish my current work.
Regarding the bootstrap issue and hovering , If you find a fix please let me know, I also excluded the bootstrap reference and the issue was resolved but the thing is , I cannot exclude bootstrap , my whole website is built using bootstrap. Please let me know if you find a fix for it.
One solution for the text issue is to add the following styling which should overwrite the bootstrap styling on the input with the default styling's color.
.ui-state-hover input, .ui-widget-content .ui-state-hover input, .ui-widget-header .ui-state-hover input { color: #666; }
If you have any further questions or concerns with this, please let me know.
These posts are really helpful, thanks
Please let me know if you need further assistance with this issue.