0

I am using a combination of HTML, Javascript and shiny to build an application. I need to get the input from dynamic input content and generate dynamic output.

My html (www/index.html) to generate the ui is 

<html lang="en">
    <head>
        <!-- CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
        <!-- Javascript -->
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
        <script type="text/javascript" src="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js"></script>
        <script src="scripts.js"></script> 
    </head>

    <body>
        <br>
          <p>
            <label>Multiply Number By:</label><br /> 
            <input type="number" name="n" value="5" min="1" max="10" />
          </p>


        <div id = "mydiv" class="controls  multi-field-wrapper row">
            <div class="multi-fields">
                <div class="multi-field col-md-11 col-lg-11">
                    <input type="text" name="first_num[]" placeholder="First Number?" class="col-md-4 col-lg-3" >
                    <input type="text" name="second_num[]" placeholder=" Second Number?" class="col-md-4 col-lg-3 " >
                    <input type="text" name="third_num" placeholder="Third Number?" class="col-md-4 col-lg-3 " >
                    <a href="#" class="col-md-1 col-lg-1 addField" style='padding-left:20px'>
                        <span class="add-field glyphicon glyphicon-plus-sign"></span>
                    </a>
                </div>
            </div> 
        </div>

        <div id="table" class="shiny-html-output"></div>
    </body>
</html>

My jquery script (www/scripts.js) for dynamic content is 

jQuery(document).ready(function() {
    $('.multi-field-wrapper').each(function() {
    var $wrapper = $('.multi-fields', this);
    var remove = '<a href="#" style="padding-left:20px" class ="remove-field "><span class=" glyphicon glyphicon-minus-sign"></span></a>';

    $(".add-field", $(this)).on('click', function(e)  {
        e.preventDefault();
        $ccc = $('.multi-field:first-child', $wrapper).clone(true).append(remove).appendTo($wrapper);
        $ccc.find('.addField').remove();
        $ccc.find('input').val('').focus();
    });
    $('.multi-field ', $wrapper).on('click', '.remove-field' ,function(e) {
       e.preventDefault();
        if ($('.multi-field', $wrapper).length > 1)
            $(this).parent('.multi-field').remove();
    });
});
});

My server.R file looks like 

library(shiny)

# Define server logic for random distribution application
server <- shinyServer(function(input, output) {

    cat("unlist(input)")
    data <- reactive({ 

    cat("I am here")
    num_times <- input$n    


  })

# Generate an HTML table view of the data
  output$table <- renderTable({
    x=data()
    data.frame(c(1*x,2*x,3*x))
  })
})

In the output, I just want to multiply the numbers in the dynamic table with number in the Multiply Number By input, as shown in the picture below. enter image description here Where I am facing most difficulty is getting the values of dyanamic content in ther server.R file. Thanks

discipulus
  • 2,665
  • 3
  • 34
  • 51
  • 1
    Is there a reason you want to create the UI using pure html instead of in R using the `ui.R` file? You can probably use javascript and https://ryouready.wordpress.com/2013/11/20/sending-data-from-client-to-server-and-back-using-shiny/ to send the values to server.R, but it's probably much easier if you build your UI in R use `ui.R`. – Xiongbing Jin Jun 06 '16 at 16:39
  • Actually, this problem is a part of a big questionnaire which is developed in html. I could send the values to the shiny server of all the other 65 questions but this. – discipulus Jun 07 '16 at 07:00

0 Answers0