We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Autocomplete with same ID

Thread ID:

Created:

Updated:

Platform:

Replies:

125627 Aug 29,2016 12:38 PM Aug 31,2016 06:41 AM JavaScript 1
loading
Tags: ejAutoCompleteTextBox
Lory
Asked On August 29, 2016 12:38 PM

Hi Team,

I have a project in MVC platform that makes use of the same partial view for a form but with different functionalities. I'm having a problem showing the options of selectCar in partialView1 but it shows in partialView2. How do I resolve this without having to create the same form just different ids? Thanks
 
<div class="content-container-fluid">
        <div class="row">
            <div class="cols-sample-area">
                <div class="frame">
                    <div class="control">
                      <div id="partialView1">                      
                      <input type="text" id="selectCar" />
                        </div>
                      <div id="partialView2">                                                
                        <input type="text" id="selectCar" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" class="jsScript">
        $(function () {
            // declaration
            var carList = [
                "Audi S6", "Austin-Healey", "Alfa Romeo", "Aston Martin",
                "BMW 7", "Bentley Mulsanne", "Bugatti Veyron",
                "Chevrolet Camaro", "Cadillac",
                "Duesenberg J", "Dodge Sprinter",
                "Elantra", "Excavator",
                "Ford Boss 302", "Ferrari 360", "Ford Thunderbird",
                "GAZ Siber",
                "Honda S2000", "Hyundai Santro",
                "Isuzu Swift", "Infiniti Skyline",
                "Jaguar XJS",
                "Kia Sedona EX", "Koenigsegg Agera",
                "Lotus Esprit", "Lamborghini Diablo",
                "Mercedes-Benz", "Mercury Coupe", "Maruti Alto 800",
                "Nissan Qashqai",
                "Oldsmobile S98", "Opel Superboss",
                "Porsche 356", "Pontiac Sunbird",
                "Scion SRS/SC/SD", "Saab Sportcombi", "Subaru Sambar", "Suzuki Swift",
                "Triumph Spitfire", "Toyota 2000GT",
                "Volvo P1800", "Volkswagen Shirako"
            ];

            $('#div1 #selectCar').ejAutocomplete({
                width: "100%",
                watermarkText: "Select a car",
                dataSource: carList,
              showPopupButton: true,
            });
          
            $('#div2 #selectCar').ejAutocomplete({
                  width: "100%",
                  watermarkText: "Select a car",
                  dataSource: carList,
                  showPopupButton: true,
              });
        });
    </script>

Selvamani Sankarappan [Syncfusion]
Replied On August 31, 2016 06:41 AM

Hi Lory,   
  
Thanks for Contacting Syncfusion Support,   
  
We had checked your code example. As per the HTML standard, we should not use the same id for multiple elements in a page. Please refer the following link:   
 
 
We can render the multiple controls using the class name instead of id. But it will not work in our Autocomplete control. So, we considered this as a bug and this issue fix will be included in our Volume 3, 2016 release.   
  
Regards,   
Selvamani S   


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;