kendo ui upload layout modification

2 posts, 1 answers
  1. David
    David  avatar
    20 posts
    Member since:
    Oct 2012

    Posted 06 Mar 2013 Link to this post

    Hi,

    How i can put modify the browse button sitting side by side with the submit button (same line). How i can change the browse button color, i tried but only work in IE 7. the colour not change in IE 8 or above.

    I use the code from sample:
    <form method="post" action='@Url.Action("Submit")' style="width:45%">
        <div>
            @(Html.Kendo().Upload()
                .Name("files")
            )
            <p>
                <input type="submit" value="Submit" class="k-button" />
            </p>
        </div>
    </form>
    
    
    Thank you


    Please advise
  2. Answer
    Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2159 posts

    Posted 07 Mar 2013 Link to this post

    Hello David,

    In order to position the Submit button side by side with the Select button you should add it dynamically to the page via JavaScript, because the Upload widget is generating a div tag and the input cannot be positioned there only with CSS.
    E.g.

    $(document).ready(function () {
        $(".k-button.k-upload-button").after('<input type="submit" value="Submit" class="k-button" />');
    });

    To override the default styles for the button color, you should specify the following CSS style
    E.g.
    <style>
      .k-button.k-upload-button
      {
          color: purple;
      }
    </style>


     

    Regards,
    Dimiter Madjarov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
Back to Top