diff --git a/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx b/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx
index 1af74c3d27a..9b2721bd897 100644
--- a/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx
+++ b/packages/grafana-ui/src/components/DataSourceSettings/DataSourceHttpSettings.tsx
@@ -167,13 +167,14 @@ export const DataSourceHttpSettings: React.FC<HttpSettingsProps> = (props) => {
               <div className="gf-form">
                 <FormField
                   label="Timeout"
+                  type="number"
                   labelWidth={13}
                   inputWidth={20}
                   tooltip="HTTP request timeout in seconds"
                   value={dataSourceConfig.jsonData.timeout}
                   onChange={(event) => {
                     onSettingsChange({
-                      jsonData: { ...dataSourceConfig.jsonData, timeout: event.currentTarget.value },
+                      jsonData: { ...dataSourceConfig.jsonData, timeout: parseInt(event.currentTarget.value, 10) },
                     });
                   }}
                 />
diff --git a/pkg/models/datasource_cache.go b/pkg/models/datasource_cache.go
index bb0a2b28d40..83c98bd6980 100644
--- a/pkg/models/datasource_cache.go
+++ b/pkg/models/datasource_cache.go
@@ -4,6 +4,7 @@ import (
 	"crypto/tls"
 	"fmt"
 	"net/http"
+	"strconv"
 	"sync"
 	"time"
 
@@ -17,8 +18,15 @@ func (ds *DataSource) getTimeout() time.Duration {
 	timeout := 0
 	if ds.JsonData != nil {
 		timeout = ds.JsonData.Get("timeout").MustInt()
+		if timeout <= 0 {
+			if timeoutStr := ds.JsonData.Get("timeout").MustString(); timeoutStr != "" {
+				if t, err := strconv.Atoi(timeoutStr); err == nil {
+					timeout = t
+				}
+			}
+		}
 	}
-	if timeout == 0 {
+	if timeout <= 0 {
 		timeout = setting.DataProxyTimeout
 	}
 	return time.Duration(timeout) * time.Second
diff --git a/pkg/models/datasource_cache_test.go b/pkg/models/datasource_cache_test.go
index 9569d9c3dd6..08b7b646de7 100644
--- a/pkg/models/datasource_cache_test.go
+++ b/pkg/models/datasource_cache_test.go
@@ -14,6 +14,7 @@ import (
 	"github.com/grafana/grafana/pkg/infra/httpclient"
 	"github.com/grafana/grafana/pkg/setting"
 	"github.com/grafana/grafana/pkg/util"
+	"github.com/stretchr/testify/assert"
 	"github.com/stretchr/testify/require"
 )
 
@@ -310,6 +311,27 @@ func TestDataSource_GetHttpTransport(t *testing.T) {
 	})
 }
 
+func TestDataSource_getTimeout(t *testing.T) {
+	setting.DataProxyTimeout = 30
+	testCases := []struct {
+		jsonData        *simplejson.Json
+		expectedTimeout time.Duration
+	}{
+		{jsonData: simplejson.New(), expectedTimeout: 30 * time.Second},
+		{jsonData: simplejson.NewFromAny(map[string]interface{}{"timeout": nil}), expectedTimeout: 30 * time.Second},
+		{jsonData: simplejson.NewFromAny(map[string]interface{}{"timeout": 0}), expectedTimeout: 30 * time.Second},
+		{jsonData: simplejson.NewFromAny(map[string]interface{}{"timeout": 1}), expectedTimeout: time.Second},
+		{jsonData: simplejson.NewFromAny(map[string]interface{}{"timeout": "2"}), expectedTimeout: 2 * time.Second},
+	}
+
+	for _, tc := range testCases {
+		ds := &DataSource{
+			JsonData: tc.jsonData,
+		}
+		assert.Equal(t, tc.expectedTimeout, ds.getTimeout())
+	}
+}
+
 func TestDataSource_DecryptedValue(t *testing.T) {
 	t.Run("When datasource hasn't been updated, encrypted JSON should be fetched from cache", func(t *testing.T) {
 		ClearDSDecryptionCache()